1. 程式人生 > >JavaScript基礎入門教程(二)

JavaScript基礎入門教程(二)

alert .get OS 全部 isnan rep mut 分別是 只有一個

說明

  前一篇博客介紹了js以及一些關於js基本類型的簡單知識,本篇博客將詳細介紹js的基礎類型,捎帶介紹對象類型,更詳細的對象類型的說明將後續再講。

js中類型的說明

  js中的類型分為基本類型和對象類型,其中基本類型包括:①數字、②字符串、③布爾值。此外還有兩個原始值null和undefined。其中對象包括數組對象、函數對象和普通對象,普通對象是“命名值”的無序集合,而數組對象是帶編號的值的有序集合。JavaScript核心還定義了三種有用的類:日期(Data)類、正則(RegExp)類、錯誤(Error)類。

數字

  和常見的其它編程語言不同,js不區分整數和浮點數,js中所有的數值均用浮點數值表示。

整型直接量

  在js中一個數字序列默認是十進制的整數,同時支持使用"0x"或"0X"開頭的十六進制,值得註意的是雖然有些JavaScript解釋器支持0開頭的八進制表示形式,但是ECMAScript標準並不支持,所以盡量不要使用八進制表示形式,以免出現移植上的問題。

浮點型直接量

  浮點型直接量的表示形式為:[digits][.digits][(E|e)[(+|-)]digits],例如①3.14、②6.02e23、③.22e-23 //0.22x10-23

js中的算術運算

  js不僅支持常見的加(+)減(-)乘(*)除(/)和求余(%),還支持更復雜的運算,不過需要Math對象的支持:

js語句 作用
Math.pow(2,53) 求2的53次冪
Math.round(0.6) 四舍五入,結果為1.0
Math.max(x,y,z) 求最大值
Math.PI 返回圓周率π的值

  js的算術運算會出現上溢和下溢,這與其它語言稍有區別,上溢的結果為Infinity或-Infinity,下溢的結果為0或-0,一般0和-0沒什麽區別(0===-0結果為true),但有時候還是會有不同,比如1/0結果為Infinity,而1/-0結果為-Infinity。此外還有一個結果就是NaN(Not a Number),當出現結果不是數字或者無法將其轉化為數字時用NaN表示,比如負數開方、零除以零、無窮大除以無窮大等操作。

  全局函數isNaN()和全局函數isFinity()可以用於判斷數值的類型,當一個數是NaN時isNaN()函數返回true,當一個數不是NaN、Infinity或-Infinity時isFinity()返回true。

二進制浮點數的四舍五入錯誤

  看下面的代碼:

1 var x = .3 - .2;
2 var y = .2 - .1;
3 x == y    //false
4 x == .1    //false
5 y == .1    //true

  造成這種結果的原因是因為二進制浮點數的表示是近似表示,值得註意的是這種問題不僅在js中會出現,在其它所有利用浮點數計算的語言中都會存在。為了更好的解決這種問題可以將自己要算的數同時擴大一個倍數,看下面的代碼:

1 var x = 3 - 2;
2 var y = 2 - 1;
3 x == y;    //true

日期和時間

  Date是js的語言核心的一部分,這裏簡單介紹Date的一些簡單用法,更詳細的介紹將在後續的博客中介紹。

1 var now = new Date();    //獲取當前時間
2 var then = new Date(2011,0,1);    //2011年1月1號
3 var later = new Date(2011,0,1,17,10,30)    //2011年1月1號17時10分30秒
4 var elapsed = now - then;    //結果為時間間隔的毫秒數
5 later.getFullYear();    //2011
6 later.getMonth();    //0:月份計數從0開始
7 later.getDate();    //1:每月的日期計數從1開始
8 later.getDay();    //6:0代表星期日,6代表星期六

文本

  說起字符串,就需要談到編碼方式了,js采用UTF-16的Unicode編碼,這樣以來處於“基本多語種平面”的字符都是兩個字節,而處於“輔助多語種平面”的字符是四個字節。這意味在js中長度為2的字符串可能有兩個字符,也可能只有一個字符。

1 var p = "π";
2 var e = "??";//"\ud835\udc52"
3 p.length    //1
4 e.length    //2

  需要註意一點,js中定義的各種函數操作全部是針對“基本多語種平面"的,所以在處理字符串時需要當心。

字符串直接量

  字符串直接量可以使用單引號或雙引號括起來,在ECMAScript3中,字符串直接量必須寫在一行中,而在ECMAScript5中,字符串直接量可以拆分成數行,但是每一行的結尾必須是反斜杠(\)。

1 "Wouldn‘t you prefer D‘Reilly‘s book?"
2 "one 3 long 4 line"    //ECMAScript5

  因為js和html都支持單引號和雙引號來括起內容,所以一般分別用不同的引號來括起各自的內容:

1 <bytton onclick="alert(‘hello world‘)">click me</button>

字符串的使用

  和java一樣,js支持字符串使用加號進行拼接,字符串"hello, "+"world"等價於"hello, world"。要確定一個字符串的長度可以使用其length屬性,此外js的字符串還有許多方法可供調用:

 1 var s="hello, world";
 2 var len=s.length;
 3 s.charAt(0)    //h:第一個字符
 4 s.charAt(s.length-1)    //d:最後一個字符
 5 s.substring(1,4)    //ell:第2-4個字符
 6 s.slice(1,4)    //ell:同上
 7 s.slice(-3)    //rld:最後三個字符
 8 s.indexOf("l")    //2:字符l第一次出現的位置
 9 s.lastIndexOf("l")    //10:字符l最後出現的位置
10 s.indexOf("l",3)    //3:在位置3及其之後,字符l第一次出現的位置
11 s.split(", ")    //["hello","world"]:根據", "將字符串分割成子串存在數組中。
12 s.replace("h","H")    //"Hello, world":替換全文中所有的h為H
13 s.toUpperCase()    //"HELLO, WORLD

  此外字符串的引用還有下標法,也就是說s.charAt(0)等價於s[0]。和java一樣,JavaScript 的字符串是不可變的(immutable),String 類定義的方法都不能改變字符串的內容。像 String.toUpperCase() 這樣的方法,返回的是全新的字符串,而不是修改原始字符串。

布爾值

在條件判斷時以下值會轉化為false,其它所有情況將轉化為true,包括數組、函數、對象等。值得註意的是,雖然0將轉化為false,但是"0"還是轉化為true。

1 undefined
2 null
3 0
4 -0
5 NaN
6 ""  //空字符串

null和undefined

  盡管null和undefined不盡相同,但是他們也經常可以互換。比如null==undefined的結果就為true(可以使用===嚴格等於判斷null和undefined不等)。一般來說null和undefined的區別就是null是存在但空缺值,而undefined是不存在。比如某個變量被定義了,但是沒值一般是null,但是如果是某個對象根本不存在length這個屬性,而我們強行使用他的length屬性就會返回undefined。

包裝對象

  學到現在你可能好奇過為什麽js中的基本數據類型也有屬性,比如下面的代碼,雖然s是字符串類型,但它依然有屬性。學過java的部分同學可能糾結string不應該是Object類型的一種嗎?這裏的回答是“不”,在js中string是一種獨立的基本類型,而String才是Object類型的一種。

1 var s="hello, world"
2 var world=s.substring(s.indexOf("w"), s.length);

  之所以會產生上面的效果,究其根本就是js的包裝類型造成的。js解釋器會在變量的每次使用時將一個基本類型轉化為一個臨時的對應的包裝類的類型,比如上面的s在使用它的length屬性時,js解釋器會自動執行類似temp=new String(s); temp.length;的操作來替代剛才那句話。同字符串一樣,數字和布爾值也都有對應的包裝類類型的構造函數,分別是Number()和Boolean()。null和undefined都沒有包裝類,訪問它們屬性都將報錯。

  在判等時,==運算符會判定值相同的基本類型和其對應的包裝類型相等,而===則判定不等。

可變對象的引用

  對象和原始值不同,首先它們時可變的——它們的值是可修改的:

1 var o={x:1};    //定義一個對象
2 o.x=2;            //通過修改對象屬性值來更改對象
3 o.y=3;            //再次更改這個對象,給它增加一個新屬性
4 
5 var a=[1,2,3];    //數組也是可以修改的
6 a[0]=0;            //更改數組的一個元素
7 a[3]=4;            //給數組新增一個元素

  數組和對象類型的比較是引用比較,這個和java語言相似,兩個對象即使類型相同並且屬性值也相同,它們還是不等。只有兩個引用指向同一個對象,這兩個引用才相等。

類型轉換

  由於js的弱類型,所以js解釋器本身會自動進行大量的隱式轉換,如果期望一個布爾值,js會把給定的值轉化為布爾值,轉化規則見上面,同理如果期望字符串,js會自動把給定的值轉化為字符串類型,如果期望數字,它也會自動把值轉化為數字(如果轉化結果沒有意義將得到NaN)。

技術分享圖片

接下來的關於類型轉換的東西,個人覺得這篇博客比《JavaScript權威指南》講的要好一點。

JavaScript基礎入門教程(二)