- 21天學(xué)通JavaScript
- 顧寧燕等編著
- 10296字
- 2018-12-29 13:30:25
第2章 數(shù)據(jù)類型
本章將講解JavaScript程序設(shè)計(jì)中的基本要素,即數(shù)據(jù)類型。任何一種程序設(shè)計(jì)語(yǔ)言,都離不開(kāi)對(duì)數(shù)據(jù)和業(yè)務(wù)邏輯的處理,對(duì)數(shù)據(jù)進(jìn)行操作前必須確定數(shù)據(jù)的類型。數(shù)據(jù)的類型規(guī)定了可以對(duì)該數(shù)據(jù)進(jìn)行的操作和數(shù)據(jù)存儲(chǔ)的方式。
JavaScript作為一門腳本語(yǔ)言,其使用過(guò)程完全表現(xiàn)出自動(dòng)化特點(diǎn)。和其他腳本語(yǔ)言一樣,使用時(shí)不需要顯式指定數(shù)據(jù)的類型,僅在某些特殊場(chǎng)合才需要知道某一數(shù)據(jù)的類型。JavaScript數(shù)據(jù)類型包括基本類型和復(fù)合類型,本章重點(diǎn)講解各種常用的數(shù)據(jù)類型。
● 理解和掌握基本數(shù)據(jù)類型的特點(diǎn),以便在今后程序設(shè)計(jì)中正確運(yùn)用
● 理解和掌握復(fù)合數(shù)據(jù)類型的特點(diǎn),并通過(guò)實(shí)際的練習(xí)加以鞏固
● 理解并掌握常用的內(nèi)置對(duì)象的特性和使用方法
以上幾點(diǎn)是對(duì)讀者在學(xué)習(xí)本章內(nèi)容時(shí)所提出的基本要求,也是本章希望能夠達(dá)到的目的。讀者在學(xué)習(xí)本章內(nèi)容時(shí)可以將其作為學(xué)習(xí)的參照。
2.1 基本數(shù)據(jù)類型
每一種程序設(shè)計(jì)語(yǔ)言都規(guī)定了一套數(shù)據(jù)類型,其中最基本不可再細(xì)分的類型稱為基本數(shù)據(jù)類型。JavaScript基本數(shù)據(jù)類型包括字符串型、布爾型和數(shù)值型等,這幾種是JavaScript中使用最為普遍的數(shù)據(jù)類型,下面分別講解各種類型的特點(diǎn)和使用方法。
2.1.1 字符串型數(shù)據(jù)
在JavaScript中,字符串型數(shù)據(jù)是用引號(hào)括起的文本字符串。例如“好久不見(jiàn),你還好嗎?”或‘Bob是個(gè)聰明的孩子’。每一個(gè)字符串?dāng)?shù)據(jù)都是String對(duì)象的實(shí)例,其主要用于組織處理由多個(gè)字符構(gòu)成的數(shù)據(jù)串。定義一個(gè)字符串時(shí)不需要指定類型,只需要按以下語(yǔ)法定義即可。
定義字符串的第一種形式如下:
var hello = "你好啊";
定義字符串的第二種形式如下:
var hello = '你好啊';
其中,var是JavaScript中用于定義變量的關(guān)鍵字。此處用其定義一個(gè)名為hello的字符串變量,關(guān)于變量的內(nèi)容將在本書(shū)第3章詳細(xì)講解。程序執(zhí)行時(shí)系統(tǒng)自動(dòng)為hello采用字符串的處理方式,此處字符串變量hello的數(shù)據(jù)內(nèi)容為“你好啊”。第一種定義方式和第二種定義方式效果完全一樣,系統(tǒng)不會(huì)對(duì)此加以區(qū)分,下面編寫(xiě)一個(gè)程序演示字符串用法。
【范例2-1】編寫(xiě)程序,練習(xí)使用引號(hào)定義字符串變量。向Peter輸出一句問(wèn)候語(yǔ),如示例代碼2-1所示。
示例代碼2-1
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 var hello = "你好啊"; // 使用雙引號(hào)定義字符串 04 var name = 'Peter'; // 使用單引號(hào)定義字符串 05 alert(hello + name ); // 將兩個(gè)字符串合在一起顯示 06 --> 07 </script> <!--腳本程序結(jié)束-->
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,所得結(jié)果如圖2-1所示。
【代碼解析】本例代碼中第3行和第4行分別使用雙引號(hào)和單引號(hào)定義字符串變量,主要演示字符串變量的定義方法。第5行使用window對(duì)象的alert方法將連接后的字符串?dāng)?shù)據(jù)輸出顯示。

圖2-1 連接后的字符串
2.1.2 深入理解字符串
在JavaScript中不區(qū)分“字符”和“字符串”,字符也被當(dāng)做字符串處理。例如,在字符串“this is a string”中“h”是按從左到右順序的第一個(gè)字符,可以使用字符串對(duì)象的charAt方法取出一個(gè)字符串中的指定的一個(gè)字符,有關(guān)“對(duì)象”的內(nèi)容將在本書(shū)的后續(xù)章節(jié)講到。
提示:字符串中的字符索引從0開(kāi)始,所以上述字符串中的“h”是該串的第一個(gè)字符。字符串中的字符按順序存儲(chǔ)。
前面講述的是有關(guān)字符串的定義方式。字符串中的字符數(shù)據(jù)僅包含常見(jiàn)的普通字符,然而字符串中可以包含用于特殊目的字符。比如用于換行控制的字符“\n”,此類字符在JavaScript中稱為轉(zhuǎn)義字符。轉(zhuǎn)義字符的定義以“\”開(kāi)始,JavaScript中的轉(zhuǎn)義字符如表2-1所示。
表2-1 JavaScript中部分常用的轉(zhuǎn)義字符

表2-1列出了一些常用的轉(zhuǎn)義字符,更多的轉(zhuǎn)義字符請(qǐng)查閱相關(guān)資料。一般來(lái)說(shuō)轉(zhuǎn)義字符主要用于在字符串中輸入一些控制字符和系統(tǒng)已經(jīng)保留了的字符,比如雙引號(hào)、單引號(hào)和左斜杠等。下面通過(guò)編寫(xiě)程序演示轉(zhuǎn)義字符的使用方法。
【范例2-2】編寫(xiě)程序,使用轉(zhuǎn)義字符在字符串中輸出回車換行、制表符和引號(hào)等。演示轉(zhuǎn)義字符的使用方法,如示例代碼2-2所示。
示例代碼2-2
01 <script language="javascript"> // 腳本程序開(kāi)始 02 var str1 = "1,使用回車換行符\n"; // 行尾使用"\n"作回車換行 03 var str2 = "2,使用回車符\r"; // 行尾使用"\r"回車符 04 var str3 = "3,使用:\t制表符\n"; // 行中間使用一個(gè)制表符"\t" 05 var str4 = "4,使用\"雙引號(hào)\""; // 使用引號(hào)"\"" 06 var str = str1 + str2 + str3 + str4; // 將4個(gè)字符串連接為了一個(gè)串用于顯示 07 alert(str); // 在對(duì)話框是顯示連接后的串str 08 </script> // 腳本程序結(jié)束
【運(yùn)行結(jié)果】雙擊網(wǎng)頁(yè)文件運(yùn)行程序,其結(jié)果如圖2-2所示。

圖2-2 輸出引號(hào)
【代碼解析】第2行定義字符串變量str1并為其賦值,串末尾使用了“回車換行”轉(zhuǎn)義字符“\n”,起到換行的作用。第3行定義字符串變量str2,串末尾使用“回車”轉(zhuǎn)義字符“\r”,相當(dāng)于輸入字符串時(shí)按了一次回車鍵。第4行所定義的字符變量str3的值中使用了“制表符”轉(zhuǎn)義字符“\t”,作用是在輸出該字符串時(shí)將其當(dāng)做一個(gè)“Tab”鍵處理。
第5行的字符串變量str4的值中使用了引號(hào)轉(zhuǎn)義字符“\"”。因?yàn)橐?hào)已經(jīng)被JavaScript保留為關(guān)鍵字符,所以用戶在字符串中使用引號(hào)時(shí)采用轉(zhuǎn)義字符“\"”即可。第6行將前面定義的4個(gè)字符串連接為一個(gè)字符串str,并用于以后輸出顯示。
提示:一部分轉(zhuǎn)義字符在輸出為HTML文本流時(shí)并不發(fā)生作用,比如制表符、回車換行等。讀者不妨自行測(cè)試,將上述例子中的alert(str)換成document.write(str)后所得結(jié)果與圖2-2相比較。
2.1.3 使用數(shù)值型數(shù)據(jù)
JavaScript中用于表示數(shù)字的類型稱為數(shù)字型,不像其他編程語(yǔ)言那樣區(qū)分整型、浮點(diǎn)型。數(shù)字型用雙精度浮點(diǎn)值來(lái)表示數(shù)字?jǐn)?shù)據(jù),可以表示(-253,+253)區(qū)間中的任何值。數(shù)字的值可以用普通的記法也可以使用科學(xué)記數(shù)法。
JavaScript的數(shù)字可以寫(xiě)成十進(jìn)制、十六進(jìn)制和八進(jìn)制,其各種寫(xiě)法如下:
● 十進(jìn)制,可以用普通記法和科學(xué)記數(shù)法。
10; // 數(shù)字 10.1; // 數(shù)字 0.1; // 數(shù)字 3e7; // 科學(xué)記數(shù) 0.3E7; // 科學(xué)記數(shù)
● 十六進(jìn)制以“0X”或“0x”開(kāi)頭后面跟0~F的十六進(jìn)制數(shù)字,沒(méi)有小數(shù)和指數(shù)部分。
0xAF3E; // 十六進(jìn)制 0X30FB; // 十六進(jìn)制
● 八進(jìn)制以0開(kāi)頭,后跟0~7的八進(jìn)制數(shù)字,同樣沒(méi)有小數(shù)和指數(shù)部分。
037; // 八進(jìn)制 012346; // 八進(jìn)制
以上是常用的數(shù)字表示法,下面通過(guò)編寫(xiě)程序來(lái)加深對(duì)數(shù)字型數(shù)據(jù)的理解。
【范例2-3】編寫(xiě)程序,練習(xí)八進(jìn)制、十六進(jìn)制、十進(jìn)制數(shù)字的表示方法。演示JavaScript常用的數(shù)字型數(shù)據(jù)的使用方法,如示例代碼2-3所示。
示例代碼2-3
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 // 使用16進(jìn)制數(shù) 04 var i = 0Xa1; // 分別定義兩個(gè)數(shù)字變量,并使用0x和 // 0X作十六進(jìn)制設(shè)置初值 05 var j = 0xf2; 06 var s = i + j; // 十六進(jìn)制變量i與j相加 07 // 輸出為十進(jìn)制 08 document.write("<li>十六進(jìn)制數(shù)0xa1等于十進(jìn)制數(shù):" + i + "<br>" ); 09 document.write("<li>十六進(jìn)制數(shù)0xf2等于十進(jìn)制數(shù):" + j + "<br>" ); 10 document.write("<li>十六進(jìn)制數(shù)0xf2加上0xa1的和為:" + s + "<br>" ); 11 12 // 使用8進(jìn)制數(shù) 13 var k = 0123; // 分別定義兩個(gè)數(shù)值變量,分別用八進(jìn)制值 // 設(shè)置為初值 14 var l = 071; 15 var m = k + l; // 兩個(gè)變量的值相加 16 // 輸出為十進(jìn)制 17 document.write("<li>八進(jìn)制數(shù)0123等于十進(jìn)制數(shù):" + k + "<br>" ); 18 document.write("<li>八進(jìn)制數(shù)071等于十進(jìn)制數(shù):" + l + "<br>" ); 19 document.write("<li>八進(jìn)制數(shù)0123加上071的和為:" + m + "<br>" ); 20 // 使用10進(jìn)制 21 var t1 = 0.1; // 定義十進(jìn)制小數(shù)數(shù)字的形式 22 var t2 = 1.1; 23 var t3 = 2e3; // 使用科學(xué)計(jì)數(shù)法表示數(shù)值 24 var t4 = 2e-3 25 var t5 = 0.1e2; 26 var t6 = 0.1e-2; // 將各變量的值全部輸出 27 document.write("<li>十進(jìn)制帶小數(shù)的形式:" + t1 + "和" + t2 + "<br>" ); // 在文檔中輸出變量 28 document.write("<li>十進(jìn)制科學(xué)記數(shù)2e3等于:" + t3 + "<br>" ); // 在文檔中輸出變量 29 document.write("<li>十進(jìn)制科學(xué)記數(shù)2e-3等于:" + t4 + "<br>" ); // 在文檔中輸出變量 30 document.write("<li>十進(jìn)制科學(xué)記數(shù)0.1e2等于:" + t5 + "<br>" ); // 在文檔中輸出變量 31 document.write("<li>十進(jìn)制科學(xué)記數(shù)0.1e-2等于:" + t6 + "<br>" ); // 在文檔中輸出變量 32 --> 33 </script> // 腳本程序開(kāi)始
【運(yùn)行結(jié)果】雙擊網(wǎng)頁(yè)文件運(yùn)行程序,其結(jié)果如圖2-3所示。

圖2-3 各種進(jìn)制數(shù)混合運(yùn)算
【代碼解析】本示例第4~6行定義三個(gè)變量,并分別賦十六進(jìn)制表示的初值。第8~10行將三個(gè)變量輸出為十進(jìn)制表示的數(shù)。第13~15行定義三個(gè)變量,分別賦八進(jìn)制表示的初值。第17~19行將三個(gè)變量輸出為十進(jìn)制表示的數(shù)。第21~26行定義數(shù)個(gè)變量并對(duì)它們賦予用不同表示法表示的十進(jìn)制數(shù)值。第27~31行將變量t1~t6逐一輸出為普通的十進(jìn)制數(shù)字。
提示:用科學(xué)記數(shù)法、十六進(jìn)制記數(shù)法和八進(jìn)制記數(shù)法表示的數(shù)字,在輸出時(shí)全部自動(dòng)轉(zhuǎn)換為普通的十進(jìn)制形式。
2.1.4 使用布爾型數(shù)據(jù)
布爾型是只有“真”和“假”兩個(gè)值的數(shù)據(jù)類型。作為邏輯表達(dá)式的結(jié)果,真值用“true”表示,假值用“false”表示。事實(shí)上,非0值即為“真”,0值即為“假”。布爾型數(shù)據(jù)通常用來(lái)表示某個(gè)條件是否成立,定義的一個(gè)布爾型變量的形式如下:
var b = true // 布爾型變量
或者如下:
var b = false; // 布爾型變量
提示:在JavaScript中定義任何變量都不需要顯式地為其指定類型,系統(tǒng)會(huì)根據(jù)變量的值類型來(lái)確定變量的數(shù)據(jù)類型。上述變量b的值為true或false時(shí),系統(tǒng)會(huì)確定該變量的數(shù)據(jù)類型為布爾型。
下面編寫(xiě)程序演示布爾數(shù)據(jù)類型的使用方法。
【范例2-4】編寫(xiě)程序,練習(xí)布爾型數(shù)據(jù)的使用方法。驗(yàn)證“非零值為真,零值為假”,掌握布爾型數(shù)據(jù)的特點(diǎn),如示例代碼2-4所示。
示例代碼2-4
01 <script language="javascript"> // 腳本程序 02 <!-- 03 var b1 = true; // 定義布爾型變量b1并賦初始為“真” 04 if( b1 ) //判斷b1的真是否為真,真則執(zhí)行“{}” // 中的語(yǔ)句 05 { 06 document.write("變量b1的值為\"真\"<br>"); // 輸出提示 07 } 08 var b2 = false; // 定義布爾變量 09 if( b2 ) // 為真時(shí) 10 { 11 document.write("變量b2的值為\"真\"<br>"); // 輸出提示 12 } 13 else // 為假時(shí) 14 { 15 document.write("變量b2的值為\"假\"<br>"); // 輸出提示 16 } 17 var b3 = 0.1; // 定義數(shù)字類型變量b3并賦予非0值 18 if( b3 ) // 此處b3被當(dāng)做布爾型變量,若為真 19 { 20 document.write("變量b3的值為\"真\"<br>"); // 輸出提示 21 } 22 var b4 = -1; // 定義數(shù)字類型變量b4并賦予非0值 23 if( b4 ) // 此處b4被當(dāng)做布爾型變量,若為真 24 { 25 document.write("變量b4的值為\"真\"<br>"); // 輸出提示 26 } 27 var b5 = 0; // 定義數(shù)字類型變量并賦予0值 28 if( b5 ) // 此處b5被當(dāng)做布爾型變量,若為真 29 { 30 document.write("變量b5的值為\"真\"<br>"); // 輸出提示 31 } 32 else // 為假時(shí) 33 { 34 document.write("變量b5的值為\"假\"<br>"); // 輸出提示 35 } 36 --> 37 </script> // 腳本程序結(jié)束
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,其結(jié)果如圖2-4所示。
【代碼解析】本示例使用了if語(yǔ)句對(duì)布爾型變量的值進(jìn)行判斷,關(guān)于if語(yǔ)句將在后面的章節(jié)講到。此處讀者只需知道如果if后小括號(hào)里布爾型變量的值為真時(shí),則執(zhí)行if后“{}”中的語(yǔ)句。

圖2-4 非零值為真
第3行定義一個(gè)布爾型變量并為其賦予初值true,在第4行中將其作為if控制語(yǔ)句的測(cè)試條件。其值為“真”,于是執(zhí)行第5~7行“{}”中的內(nèi)容。第18行和第23行分別將非0數(shù)字型變量當(dāng)做布爾型變量使用,作為if控制語(yǔ)句的測(cè)試條件。結(jié)果表明,非0值的數(shù)字型變量作為布爾型變量使用時(shí),其值為“真”。第27~35行使用了一個(gè)0值數(shù)字型變量b5作布爾型變量使用,結(jié)果表明其布爾值為“假”。
提示:JavaScript中除了“true”和“false”表示“真”和“假”外,任意非0值就表示“真”,0值表示“假”,請(qǐng)讀者多做測(cè)試。
2.2 復(fù)合數(shù)據(jù)類型
前面一節(jié)所講的字符串型、數(shù)值型和布爾型數(shù)據(jù)是JavaScript的簡(jiǎn)單數(shù)據(jù)類型。本節(jié)將介紹復(fù)合數(shù)據(jù)類型,對(duì)象和數(shù)組。對(duì)象是JavaScript封裝了一套操作方法和屬性的類實(shí)例,是基本數(shù)據(jù)類型之一。本書(shū)后面的章節(jié)將安排專門的內(nèi)容來(lái)介紹數(shù)組。
2.2.1 常用內(nèi)置對(duì)象
在面向?qū)ο蟮脑O(shè)計(jì)模式中,將數(shù)據(jù)和處理數(shù)據(jù)的方法捆綁在一起形成一個(gè)整體,稱為對(duì)象。換句話說(shuō),對(duì)象封裝了數(shù)據(jù)和操作數(shù)據(jù)的方法,要使用其中的數(shù)據(jù)或方法須先創(chuàng)建該對(duì)象。可以使用new運(yùn)算符來(lái)調(diào)用對(duì)象的構(gòu)造函數(shù),從而創(chuàng)建一個(gè)對(duì)象,方式如下:
var obj = new Object(); // 創(chuàng)建新對(duì)象
參數(shù)說(shuō)明:
● obj,變量名,必需。指向創(chuàng)建的Object對(duì)象。
要訪問(wèn)已經(jīng)創(chuàng)建對(duì)象的屬性或方法,可以使用“.”運(yùn)算符,形式如下:
obj.toString(); // 作為字符串輸出
上述代碼調(diào)用對(duì)象obj的toString方法。
JavaScript內(nèi)建了幾種常用的對(duì)象,封裝了常用的方法和屬性,如表2-2所示。
表2-2 JavaScript中常用的對(duì)象

下面對(duì)表2-2中常用的對(duì)象進(jìn)行講解,包括Date、String、Global、Number和Math,其他對(duì)象在后面的章節(jié)有專門的內(nèi)容講解。
2.2.2 常用日期對(duì)象
JavaScript將與日期相關(guān)的所有特性封裝進(jìn)Date對(duì)象,包括日期信息及其操作,主要用來(lái)進(jìn)行與時(shí)間相關(guān)的操作。Data對(duì)象一個(gè)典型應(yīng)用是獲取當(dāng)前系統(tǒng)時(shí)間,使用前首先創(chuàng)建該對(duì)象的一個(gè)實(shí)例,創(chuàng)建語(yǔ)法如下:
date = new Date( ); // 直接創(chuàng)建 date = new Date( val ); // 指定日期創(chuàng)建 date = new Date( y , m, d [, h [, min [, sec [,ms]]]] ); // 指定日期創(chuàng)建
參數(shù)說(shuō)明:
● val,必選項(xiàng)。表示指定日期與1970年1月1日午夜間全球標(biāo)準(zhǔn)時(shí)間的毫秒數(shù)。
● y、m和d分別對(duì)應(yīng)年、月和日,必選。h、min、sec和ms分別對(duì)應(yīng)時(shí)、分、秒和毫秒,可選。
這三種創(chuàng)建方式中根據(jù)需要選擇一種即可。第一種方式創(chuàng)建一個(gè)包含創(chuàng)建時(shí)時(shí)間值的Date對(duì)象。第二種方式創(chuàng)建一個(gè)與1970年1月1日午夜間全球標(biāo)準(zhǔn)時(shí)間相差val毫秒的日期。第三種方式創(chuàng)建指定年、月、日、時(shí)、分、秒和毫秒的日期。
【范例2-5】編寫(xiě)程序,顯示程序運(yùn)行時(shí)的本地時(shí)間。演示Date對(duì)象的使用方法,如示例代碼2-5所示。
示例代碼2-5
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 var cur = new Date(); // 創(chuàng)建當(dāng)前日期對(duì)象cur 04 var years = cur.getYear(); //從日期對(duì)象cur中取得年數(shù) 05 var months = cur.getMonth(); // 取得月數(shù) 06 var days = cur.getDate(); // 取得天數(shù) 07 var hours = cur.getHours(); // 取得小時(shí)數(shù) 08 var minutes = cur.getMinutes(); // 取得分鐘數(shù) 09 var seconds = cur.getSeconds(); // 取得秒數(shù) 10 // 顯示取得的各個(gè)時(shí)間值 11 alert( "此時(shí)時(shí)間是:" + years + "年" + (months+1) + "月" // 輸出日期信息 12 + days + "日" + hours + "時(shí)" + minutes + "分" 13 + seconds + "秒" ); 14 --> 15 </script> <!--腳本程序結(jié)束-->
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,其結(jié)果如圖2-5所示。
【代碼解析】本示例使用Date對(duì)象取得當(dāng)前日期。第4行調(diào)用Date對(duì)象的默認(rèn)構(gòu)造函數(shù)Date創(chuàng)建一個(gè)對(duì)象,Date對(duì)象的默認(rèn)構(gòu)造函數(shù)將創(chuàng)建帶有當(dāng)前時(shí)間信息的Date對(duì)象。若要?jiǎng)?chuàng)建帶有指定時(shí)間信息的Date對(duì)象,請(qǐng)使用帶參數(shù)的構(gòu)造函數(shù),或者創(chuàng)建后調(diào)用Date對(duì)象的方法設(shè)定時(shí)間。第8~18行分別使用Date對(duì)象的get系列方法取得相關(guān)值,第20行組合顯示各變量的值。

圖2-5 輸出當(dāng)前時(shí)間
Date對(duì)象提供了大量用于日期操作的方法和屬性,下面歸納Date對(duì)象的部分常用方法,如表2-3所示。
表2-3 Date對(duì)象的常用方法

表2-3中g(shù)et系列是獲取時(shí)間值的方法,set系列是設(shè)置時(shí)間值的方法,下面通過(guò)編寫(xiě)程序加以鞏固。
【范例2-6】編寫(xiě)程序,創(chuàng)建一個(gè)Date對(duì)象,將其中日期設(shè)置為2007年4月20日。練習(xí)設(shè)置Date對(duì)象中時(shí)間值,如示例代碼2-6所示。
示例代碼2-6
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 var dateObj = new Date(); // 創(chuàng)建一個(gè)日期對(duì)象 04 dateObj.setYear( 2007 ); // 設(shè)置日期對(duì)象的年份 05 dateObj.setDate( 20 ); // 設(shè)置日期對(duì)象的日期 06 dateObj.setMonth( 4 ); // 設(shè)置日期對(duì)象的月份 07 // 顯示日期對(duì)象中的時(shí)間 08 alert( "dateObj中設(shè)定的時(shí)間為:" + dateObj.getYear() + "年" // 輸出日期信息 09 + dateObj.getMonth() + "月" + dateObj.getDate() + "日" ); 10 --> 11 </script> <!--腳本程序結(jié)束-->
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,其結(jié)果如圖2-6所示。
【代碼解析】第3~10行創(chuàng)建一個(gè)日期對(duì)象并使用其set系列方法設(shè)置各個(gè)時(shí)間值。第08行調(diào)用日期對(duì)象的get系列方法取出的各個(gè)時(shí)間值,并在對(duì)話框中顯示出來(lái)。

圖2-6 Date對(duì)象中的日期
2.2.3 理解全局對(duì)象
全局對(duì)象是所有全局方法的擁有者,用來(lái)統(tǒng)一管理全局方法,全局方法也就是指全局函數(shù)。該對(duì)象不能使用new運(yùn)算符創(chuàng)建對(duì)象實(shí)例,所有方法直接調(diào)用即可。以下是幾個(gè)常用的Global對(duì)象的方法,如表2-4所示。
表2-4 Global對(duì)象的常用方法

【范例2-7】編寫(xiě)程序,調(diào)用Global對(duì)象的isNaN方法判斷一個(gè)值是否為數(shù)值,如示例代碼2-7所示。
示例代碼2-7
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 var a = NaN; // 定義非數(shù)字常量 04 var b = "123"; // 字符串樣式數(shù)字 05 var c = 123; // 數(shù)字變量 06 var d = "1.23"; // 字符串樣式數(shù)字 07 document.write( "<b>Global對(duì)象的isNaN方法</b><br>" ); // 輸出標(biāo)題 08 var ta = isNaN( a ); // 用isNaN方法測(cè)試a的值 09 document.write( "<li>a的值是否是NaN:" + ta + "<br>" ); // 輸出提示 10 var tb = isNaN( b ); // 測(cè)試b的值 11 document.write( "<li>b的值是否是NaN:" + tb + "<br>" ); // 輸出提示 12 var tc = isNaN( c ); // 測(cè)試c的值 13 document.write( "<li>c的值是否是NaN:" + tc + "<br>" ); // 輸出提示 14 document.write( "<b>Global對(duì)象的parseInt方法</b><br>" ); // 輸出提示 15 var ib = parseInt( b ); //將字符串“123”解析為數(shù)值123 16 if( ib == c ) // 如果相等 17 { 18 document.write( "<li>b解析為數(shù)值:" + ib + "<br>" ); // 輸出標(biāo)題 19 } 20 document.write( "<b>Global對(duì)象的parseFloat方法</b><br>" ); //輸出標(biāo)題 21 var id = parseFloat( d ); //將字符串“1.23”解析為數(shù)值1.23 22 if( id == 1.23 ) // 如果相等 23 { 24 document.write( "<li>b解析為數(shù)值:" + id + "<br>" ); // 輸出提示 25 } 26 --> 27 </script> <!--腳本程序結(jié)束-->
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,其結(jié)果如圖2-7所示。

圖2-7 字符串轉(zhuǎn)換為數(shù)字
【代碼解析】本示例演示Global對(duì)象的isNaN、parseInt和parseFloat三個(gè)方法的使用方式。Global對(duì)象無(wú)須創(chuàng)建即可直接使用,因此使用其方法時(shí)也無(wú)須使用“obj.方法名”的形式。第3~6行定義一組用于測(cè)試前述三個(gè)Global方法的變量。第8行使用isNaN方法測(cè)試變量a是否為NaN值,此處返回一個(gè)為“true”的布爾值。第15和21行分別使用parseInt和parseFloat方法將字符串解析為數(shù)字。
注意:parseFloat方法不解析以非數(shù)字字符開(kāi)頭的字符串,數(shù)字字符后的字符被忽略。讀者可以將示例代碼2-7中的“var d = "1.23";”改成類似“var d = "1.23char";”的形式即可測(cè)試。
2.2.4 常用數(shù)學(xué)對(duì)象
數(shù)學(xué)對(duì)象(Math)封裝了與數(shù)學(xué)相關(guān)的特性,包括一些常數(shù)和數(shù)學(xué)函數(shù),主要使用簡(jiǎn)單一些基本的數(shù)學(xué)計(jì)算。該對(duì)象和Global對(duì)象一樣不能使用new運(yùn)算符創(chuàng)建,Math對(duì)象在程序運(yùn)行時(shí)由JavaScript環(huán)境創(chuàng)建并初始化。調(diào)用Math對(duì)象的方法或?qū)傩缘姆绞饺缦拢?/p>
Math.[ {屬性名|方法名} ];
下面列出了Math對(duì)象部分常用的方法和屬性,供查閱之用,如表2-5所示。
表2-5 Math對(duì)象常用的方法和屬性

通過(guò)表2-5可以看出,Math對(duì)象的很多方法在很大程度上簡(jiǎn)化了基本的數(shù)學(xué)運(yùn)算。比如求正弦、余弦、對(duì)數(shù)等,下面編寫(xiě)程序以熟悉Math對(duì)象的使用方法。
【范例2-8】從Math對(duì)象中獲取圓周率常數(shù),計(jì)算一個(gè)半徑為2單位的圓的面積,如示例代碼2-8所示。
示例代碼2-8
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 var r = 2; // 定義變量表示半徑 04 var pi = Math.PI; // 從Math對(duì)象中讀取周期率PI常量 05 var s = pi*r*r; // 計(jì)算面積 06 alert("半徑為2單位的圓面積為:" + s + "單位" ); // 顯示圓的面積 07 --> 08 </script> <!--腳本程序結(jié)束-->
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,其結(jié)果如圖2-8所示。

圖2-8 圓的面積
【代碼解析】第3行定義一個(gè)值為2的變量r作為圓的半徑,第4行讀取Math對(duì)象的PI屬性,并存于變量pi中。第8~10行根據(jù)圓面積求解公式計(jì)算出面積s并輸出顯示。
注意:Math對(duì)象的方法和屬性直接調(diào)而不需要?jiǎng)?chuàng)建Math對(duì)象,否則出錯(cuò)。
【范例2-9】調(diào)用Math對(duì)象的sin方法求90度角的正弦值,調(diào)用abs方法求數(shù)的絕對(duì)值。如示例代碼2-9所示。
示例代碼2-9
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 var r1 = Math.sin( Math.PI/2 ); // 求正弦 04 document.write("<li>弧度為pi/2的正弦值為:" + r1 + "<br>" ); // 輸出提示 05 var r2 = 0-r1; // 取反 06 var r3 = Math.abs( r2 ); // 求絕對(duì)值 07 document.write("<li>" + r2 + "的絕對(duì)值為:" + r3 + "<br>" ); // 輸出提示 08 --> 09 </script> <!--腳本程序結(jié)束-->
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,其結(jié)果如圖2-9所示。

圖2-9 常量PI使用弧度單位
【代碼解析】代碼第04行調(diào)用Math的sin方法計(jì)算PI/2的正弦值,結(jié)果保存到變量r1中。第08行調(diào)用Math對(duì)象的abs方法求值為負(fù)數(shù)的r2的絕對(duì)值。本程序演示了Math對(duì)象方法的調(diào)用方式,讀者可以結(jié)合表2-3對(duì)Math對(duì)象的常用方法多加練習(xí)。
注意:Math對(duì)象的sin等方法需要輸入用弧度度量的角度值參數(shù)。
2.2.5 常用字符串對(duì)象
String對(duì)象封裝了與字符串有關(guān)的特性,主要用來(lái)處理字符串。通過(guò)String對(duì)象,可以對(duì)字符串進(jìn)行剪切、合并、替換等操作??梢哉{(diào)用該對(duì)象的構(gòu)造函數(shù)創(chuàng)建一個(gè)實(shí)例,其實(shí)在定義一個(gè)字符串類型變量時(shí)也就創(chuàng)建了一個(gè)String對(duì)象實(shí)例。調(diào)用String對(duì)象的方法或?qū)傩孕问饺纭皩?duì)象名.方法名”或“對(duì)象名.屬性名”,其構(gòu)造函數(shù)如下:
String([strVal]);
參數(shù)strVal是一個(gè)字符串,可選項(xiàng)。創(chuàng)建一個(gè)包含值為strVal的String對(duì)象。
String對(duì)象的方法比較多,涵蓋了字符串處理的各個(gè)方面,讀者可根據(jù)需要查閱相關(guān)參考手冊(cè)。下面通過(guò)舉例演示String對(duì)象的使用方法。
【范例2-10】在文本串中將李白《靜夜思》的各個(gè)部分分別提取出來(lái),并格式化輸出。標(biāo)題加粗,文本居中對(duì)齊,詩(shī)歌正文顏色為灰色。如示例代碼2-10所示。
示例代碼2-10
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 var comment = "靜夜思李白床前明月光,疑是地上霜。舉頭望明月,低頭思故鄉(xiāng)。"; // 詩(shī)的內(nèi)容 04 var partial = comment.substring( 0, 3 ); // 取出標(biāo)題 05 partial = partial.bold(); // 標(biāo)題加粗 06 document.write( "<p align=\"center\">" ); // 輸出HTML標(biāo)簽“<p>”,并設(shè)置居中對(duì)齊 07 document.write( partial ); // 輸出標(biāo)題 08 partial = comment.slice( 3, 5 ); // 取出作者 09 document.write( "<br>" ); // 輸出換行標(biāo)簽<br> 10 document.write( partial ); // 輸出作者 11 partial = comment.slice( 5, 17 ); // 取出第一句詩(shī)文 12 partial = partial.fontcolor("gray"); // 設(shè)置顏色為gray(灰色) 13 document.write( "<br>" ); // 輸出換行標(biāo)簽 14 document.write( partial ); // 輸出詩(shī)句 15 partial = comment.slice( 17, 29 ); // 取出第二句詩(shī)文 16 partial = partial.fontcolor("gray"); // 設(shè)置顏色為gray(灰色) 17 document.write( "<br>" ); // 輸出換行標(biāo)簽 18 document.write( partial ); // 輸出詩(shī)句 19 document.write( "</p>" ); // 輸出HTML標(biāo)簽“<p>”的結(jié)束標(biāo)簽 20 --> 21 </script> <!--腳本程序結(jié)束-->
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,其結(jié)果如圖2-10所示。

圖2-10 格化式輸出
【代碼解析】本示例演示了String對(duì)象的使用方法。第3行創(chuàng)建一個(gè)String對(duì)象comment,其內(nèi)容為詩(shī)歌文本。第4~19行分別從comment對(duì)象中提取相應(yīng)的內(nèi)容,設(shè)置為目標(biāo)格式后輸出。其中設(shè)置加粗、顏色等方法操作的最終結(jié)果是在目標(biāo)文本中應(yīng)該HTML標(biāo)簽。
String對(duì)象的其他方法還有很多,限于篇幅在此只講部分常用的,更多信息請(qǐng)讀者查閱相關(guān)資料。本節(jié)主要介紹了Object、Global、Date、String和Math對(duì)象,JavaScript其他內(nèi)建對(duì)象將在后面的章節(jié)再做講解。
2.2.6 掌握數(shù)組對(duì)象
數(shù)組是JavaScript中另一種重要的基本數(shù)據(jù)類型。內(nèi)部對(duì)象Array封裝了所有和數(shù)組相關(guān)的方法和屬性,其內(nèi)部存在多個(gè)數(shù)據(jù)段組合存儲(chǔ)??梢孕蜗蟮貙⑵淅斫鉃橐环N有很多連續(xù)房間的樓層,每個(gè)房間都可以存放貨物,提取貨物時(shí)只需要給出樓層號(hào)和房間編號(hào)即可,如圖2-11所示。

圖2-11 數(shù)組式的房間序列
● 創(chuàng)建數(shù)組的方式1,直接使用new運(yùn)算符調(diào)用Array對(duì)象的構(gòu)造函數(shù),代碼如下所示。
var a = new Array(); // 創(chuàng)建數(shù)組
以上代碼創(chuàng)建一個(gè)沒(méi)有任何元素的數(shù)組a。
● 創(chuàng)建數(shù)組的方式2,給構(gòu)造函數(shù)傳遞數(shù)組元素為參數(shù),代碼如下所示。
var a = new Array(10, 20, 30, "string", 40 ); // 創(chuàng)建帶指定元素的數(shù)組
給構(gòu)造函數(shù)傳遞的元素參數(shù)可以是任何JavaScript數(shù)據(jù)類型,JavaScript數(shù)組各元素的類型可以不相同。上述代碼創(chuàng)建了一個(gè)5個(gè)元素的數(shù)組a。
● 創(chuàng)建數(shù)組的方式3,不調(diào)用構(gòu)造函數(shù),直接將元素放入“[]”中即可,元素間用“,”分隔。
var a = [ 10, 20, 30, "string", 40 ]; // 創(chuàng)建數(shù)組
上述代碼將創(chuàng)建一個(gè)具有5個(gè)元素的數(shù)組a,效果與方式2完全相同。
● 創(chuàng)建數(shù)組的方式4,給構(gòu)造函數(shù)傳遞數(shù)組元素個(gè)數(shù)可以創(chuàng)建具有指定元素個(gè)數(shù)的數(shù)組。
var a = new Array(3); // 指定長(zhǎng)度創(chuàng)建數(shù)組
上述代碼創(chuàng)建了一個(gè)有3個(gè)元素的數(shù)組a。數(shù)組元素的下標(biāo)從0開(kāi)始,使用“數(shù)組名[下標(biāo)]”的方式訪問(wèn)數(shù)組元素。下面編程演示數(shù)組的創(chuàng)建和使用。
【范例2-11】創(chuàng)建一個(gè)數(shù)組用于保存古代幾個(gè)大詩(shī)人的名字,通過(guò)遍歷數(shù)組逐一輸出每個(gè)詩(shī)人的名字,如示例代碼2-11所示。
示例代碼2-11
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 var poets = new Array( "王維", "杜甫", "李白", "白居易" ); // 創(chuàng)建數(shù)組 04 document.write("古代幾個(gè)大詩(shī)人:<br>"); // 輸出標(biāo)題 05 for( n in poets ) // 逐個(gè)輸出數(shù)組元素 06 { 07 document.write( "<li>" + poets[n] ); // 輸出詩(shī)人的名字 08 } 09 --> 10 </script> <!--腳本程序結(jié)束-->
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,結(jié)果如圖2-12所示。

圖2-12 遍歷數(shù)組
【代碼解析】本示例演示了創(chuàng)建數(shù)組的簡(jiǎn)單形式,通過(guò)“[]”運(yùn)算符可以讀取數(shù)組元素的內(nèi)容。第3行創(chuàng)建詩(shī)人名字?jǐn)?shù)組,第5~8行逐一將數(shù)組中的每個(gè)名字作為一個(gè)項(xiàng)目輸出到頁(yè)面文本中。
提示:創(chuàng)建數(shù)組時(shí)盡管已經(jīng)指定了元素個(gè)數(shù),但真正為元素分配內(nèi)存須等到給元素賦值的時(shí)候。
本節(jié)讓讀者對(duì)數(shù)組有一個(gè)大致印象,本書(shū)第7章將對(duì)數(shù)組做專門的講解。
2.3 其他數(shù)據(jù)類型
前面介紹了簡(jiǎn)單數(shù)據(jù)類型、復(fù)合數(shù)據(jù)類型。JavaScript是基于對(duì)象的語(yǔ)言,帶有部分面向?qū)ο蟮奶匦裕虼恕皩?duì)象”是一種用戶自定義數(shù)據(jù)類型。JavaScript用戶自定義對(duì)象使用形式非常簡(jiǎn)單,只需要定義對(duì)象的構(gòu)造函數(shù)即可。通過(guò)在構(gòu)造函數(shù)中為對(duì)象添加屬性和方法,從而形成新的數(shù)據(jù)類型。最終,函數(shù)在JavaScript中被視為一種數(shù)據(jù)類型。本節(jié)將講解函數(shù)的初級(jí)內(nèi)容和其他一些數(shù)據(jù)類型,例如null、undefined等。
2.3.1 使用函數(shù)
在JavaScript中,“函數(shù)”充當(dāng)了兩個(gè)角色,一個(gè)運(yùn)用在數(shù)據(jù)類型方面,另一個(gè)運(yùn)用在子程序設(shè)計(jì)方面。此前與“對(duì)象”有關(guān)的東西隨處可見(jiàn),然而JavaScript卻沒(méi)有使用類的概念。在此函數(shù)用來(lái)定義一種數(shù)據(jù)類型,可以認(rèn)為是用戶自定義數(shù)據(jù)類型。本書(shū)后面將安排專門的章節(jié)來(lái)講解函數(shù)和面向?qū)ο蟮膬?nèi)容。
定義一種自定義數(shù)據(jù)類型的方法如下面代碼所示。
function TypeName([arg,…]) { this.arg = arg; }
上述代碼使用“function”關(guān)鍵字定義了數(shù)據(jù)類型“TypeName”,其構(gòu)造函數(shù)帶可選參數(shù)“arg”。下面通過(guò)編程演示自定義數(shù)據(jù)類型的使用。
【范例2-12】編寫(xiě)程序,定義一種數(shù)據(jù)類型表示汽車,包含“車主”、“極速”兩種屬性。如示例代碼2-12所示。
示例代碼2-12
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 function Card( owner, rate ) // 定義車子對(duì)象 04 { 05 this.Owner = owner; // 車主 06 this.MaxRate = rate; // 極速 07 } 08 var myCard = new Card( "Sunsir", "400KMpH" ); // 創(chuàng)建一個(gè)車子實(shí)例 09 document.write( myCard.Owner + "的車子極速為" + myCard.MaxRate ); // 輸出車子的屬性 10 --> 11 </script> <!--腳本程序結(jié)束-->
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,結(jié)果如圖2-13所示。

圖2-13 程序運(yùn)行結(jié)果
【代碼解析】第3~5行使用關(guān)鍵字function定義了一個(gè)自定義數(shù)據(jù)類型Card,該類型包含兩個(gè)屬性字段。第8、9行創(chuàng)建一個(gè)Card對(duì)象實(shí)例,并將其屬性值輸出在HTML文本流中。
提示:函數(shù)的字段可以任意指定,也可以任意添加方法。
2.3.2 使用空值
前面所講過(guò)的每一種JavaScript數(shù)據(jù)類型都有自己的內(nèi)容,而編程中卻需要一種類型來(lái)表示“什么都沒(méi)有”。null類型就是為此目的而產(chǎn)生,其表示一個(gè)空值??梢允褂胣ull和一個(gè)變量進(jìn)行比較以測(cè)試該變量是否擁有內(nèi)容,通常用來(lái)判斷對(duì)象的創(chuàng)建或引用是否成功。
【范例2-13】編寫(xiě)程序,測(cè)試null值,如示例代碼2-13所示。
示例代碼2-13
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 var x = 10; // 定義變量x,并給其賦值10 04 var y = null; // 定義變量y,并賦一個(gè)空值,表示“什么都沒(méi)有” 05 if( x == null ) // 如果x為空值則 06 { 07 document.write( "x的值為空<br>" ); // 輸出提示 08 } 09 if( y == null ) // 如果y為空則 10 { 11 document.write( "y的值為空<br>" ); // 輸出提示 12 } 13 --> 14 </script> <!--腳本程序結(jié)束-->
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,結(jié)果如圖2-14所示。
【代碼解析】第3行定義一個(gè)數(shù)字型變量x并賦值10,使x擁有一個(gè)為10的數(shù)值。第4行定義一個(gè)變量y并為其賦一個(gè)null值,使y不擁有任何值。第5~12行分別測(cè)試x和y是否為空,若為空則輸出文字以表示。

圖2-14 y為null
提示:當(dāng)創(chuàng)建一個(gè)對(duì)象失敗時(shí),通常返回一個(gè)null值,此時(shí)可以通過(guò)測(cè)試返回值是否為null而確定對(duì)象創(chuàng)建是否成功。
2.3.3 使用不確定的類型
null值表示一個(gè)變量擁有空值。可以理解為已經(jīng)把“空”賦給了某個(gè)變量,而undefined則表示一個(gè)變量什么都沒(méi)有得到,連“空”都沒(méi)有。通常用來(lái)判斷一個(gè)變量是否已經(jīng)定義或已經(jīng)賦值,下面編程測(cè)試這兩者的區(qū)別。
【范例2-14】編寫(xiě)程序,測(cè)試undefined值,如示例代碼2-14所示。
示例代碼2-14
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 var v0 = 1; // 定義一個(gè)值為1的變量 04 var v1 = null; // 定義一個(gè)變量,并指定值為null 05 var v2; // 定義一個(gè)變量,但不賦任何值 06 document.write("變量v0的內(nèi)容為:" + v0 + "<br>" ); // 輸出v0 07 document.write("變量v1的內(nèi)容為:" + v1 + "<br>" ); // 輸出v1 08 document.write("變量v2的內(nèi)容為:" + v2 + "<br>" ); // 輸出v2 09 if( v1 == v2 ) // 測(cè)試“null”和“undefined”的相等性 10 { 11 document.write("\"null\"和\"undefined\"相等<br>" ); // 輸出提示 12 } 13 else // 不相等 14 { 15 document.write("\"null\"和\"undefined\"不相等<br>" ); // 輸出提示 16 } 17 --> 18 </script> <!--腳本程序結(jié)束-->
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,其結(jié)果如圖2-15所示。
【代碼解析】第3行定義變量v0并為其賦值1,使其擁有一個(gè)數(shù)字類型的值。第4行定義變量v1變賦值null。第5行聲明一個(gè)變量v2,但不賦任何值。第6~8行分別輸出變量v0、v1和v2的內(nèi)容。第9行判斷null和undefined是否相等,結(jié)果為相等。

圖2-15 區(qū)別null與undefined
提示:在應(yīng)用中null和undefined實(shí)際意義是等效的。
2.4 數(shù)據(jù)類型的轉(zhuǎn)換
JavaScript是一門簡(jiǎn)單的、弱類型的編程語(yǔ)言。使用時(shí)無(wú)須指定數(shù)據(jù)類型,系統(tǒng)會(huì)根據(jù)值的類型進(jìn)行變量類型自動(dòng)匹配,或者根據(jù)需要自動(dòng)在類型間進(jìn)行轉(zhuǎn)換。JavaScript類型轉(zhuǎn)換包括隱式類型轉(zhuǎn)換和顯式類型轉(zhuǎn)換兩種。
2.4.1 隱式類型轉(zhuǎn)換
程序運(yùn)行時(shí),系統(tǒng)根據(jù)當(dāng)前上下文的需要,自動(dòng)將數(shù)據(jù)從一種類型轉(zhuǎn)換為另一種類型的過(guò)程稱為隱式類型轉(zhuǎn)換。此前的代碼中,大量使用了window對(duì)象的alert方法和document對(duì)象的write方法。可以向這兩個(gè)方法中傳入任何類型的數(shù)據(jù),這些數(shù)據(jù)最終都被自動(dòng)轉(zhuǎn)換為字符串型。
【范例2-15】編寫(xiě)程序,收集用戶的年齡數(shù)據(jù)。當(dāng)用戶輸入的數(shù)字小于等于零時(shí)發(fā)出警告,外部輸入的數(shù)據(jù)都是字符串型,與數(shù)字作比較判斷時(shí)系統(tǒng)自動(dòng)將其轉(zhuǎn)換為數(shù)值型。如示例代碼2-15所示。
示例代碼2-15
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 var age = prompt("請(qǐng)輸入您的年齡:", "0");// 輸入年齡 04 if( age <= 0 ) // 如果輸入的數(shù)字小于等于0則視為非法 05 { 06 alert("您輸入的數(shù)據(jù)不合法!"); // 輸入非法時(shí)警告并忽略 07 } 08 else // 大于 09 { 10 alert( "你的年齡為" + age + "歲" ); // 輸出年齡 11 } 12 --> 13 </script> <!--腳本程序結(jié)束-->
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,結(jié)果如圖2-16、圖2-17所示。

圖2-16 數(shù)字轉(zhuǎn)換為字符串

圖2-17 輸出用戶輸入的數(shù)據(jù)
【代碼解析】第3行用戶輸入的數(shù)據(jù)以字符串的形式保存于變量age中。第4行將age與數(shù)字0做大小比較,此時(shí)age自動(dòng)被轉(zhuǎn)換為數(shù)值型,此過(guò)程稱為隱式類型轉(zhuǎn)換。第5~11行根據(jù)age的值是否符合要求而顯示相應(yīng)的信息。
2.4.2 顯式類型轉(zhuǎn)換
與隱式類型轉(zhuǎn)換相對(duì)應(yīng)的是顯式類型轉(zhuǎn)換,此過(guò)程需要手動(dòng)轉(zhuǎn)換到目標(biāo)類型。要將某一類型的數(shù)據(jù)轉(zhuǎn)換為另一類型的數(shù)據(jù)需要用到特定的方法。比如前面用到的parseInt、parseFloat等方法,下面再編寫(xiě)一個(gè)范例以演示這兩個(gè)方法的使用。
【范例2-16】編寫(xiě)程序,從字符串中解析出水果價(jià)格的數(shù)值數(shù)據(jù)。如果解析成功則輸出價(jià)格信息,如示例代碼2-16所示。
示例代碼2-16
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 var priceOfApple = "3元"; // 蘋(píng)果的價(jià)格 04 var priceOfBanana = "3.5元"; // 香蕉的價(jià)格 05 priceOfApple = parseInt( priceOfApple ); // 解析蘋(píng)果的價(jià)格 06 var priceOfBanana2 = parseInt( priceOfBanana ); // 解析香蕉的價(jià)格 07 if( ( priceOfApple===3 ) && ( priceOfBanana2 === 3 ) // 檢查解析是否成功 08 && ( parseFloat( priceOfBanana ) ===3.5 ) ) 09 { 10 alert( "蘋(píng)果的價(jià)格:" + priceOfApple // 輸出水果的價(jià)格 11 + "\n香蕉的價(jià)格的整數(shù)部分:" + priceOfBanana2 12 + "\n香蕉的價(jià)格:" + parseFloat( priceOfBanana ) ); 13 } 14 else // 解析失敗時(shí) 15 { 16 alert( "并沒(méi)有得到預(yù)期的轉(zhuǎn)換效果!" ); // 解析失敗時(shí)輸出警告信息 17 } 18 --> 19 </script> <!--腳本程序結(jié)束-->
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,結(jié)果如圖2-18所示。
【代碼解析】本示例主要演示顯式類型轉(zhuǎn)換,第3、4行設(shè)置兩個(gè)字符串表示兩種水果的價(jià)格。第5、6行將字符串解析為數(shù)字,得到水果價(jià)格的數(shù)值數(shù)據(jù)。第7~17行判斷所解析出的價(jià)格數(shù)據(jù)是否正確,正確時(shí)將它們輸出,否則輸出警告。

圖2-18 數(shù)字與字符串間的轉(zhuǎn)換
提示:當(dāng)要轉(zhuǎn)換的字符串帶有parseInt或parseFloat方法不可識(shí)別的字符時(shí),轉(zhuǎn)換結(jié)果可能沒(méi)法預(yù)料。讀者可自行做這方面的測(cè)試。
2.5 小結(jié)
本章主要講解了簡(jiǎn)單數(shù)據(jù)類型,其包括字符串型、數(shù)值型和布爾型。復(fù)合數(shù)據(jù)類型包括對(duì)象和數(shù)組,對(duì)象是JavaScript中最重要的數(shù)據(jù)類型之一。本章僅涉及系統(tǒng)內(nèi)置的對(duì)象,包括Global、Math、Date、Array、Number等。各種基本的數(shù)據(jù)類型之間可以相互轉(zhuǎn)換,根據(jù)轉(zhuǎn)換的方式分為隱式和顯式兩種。數(shù)據(jù)類型是程序設(shè)計(jì)語(yǔ)言最基本的要素之一,希望讀者認(rèn)真理解掌握。如果讀者對(duì)本章內(nèi)容還有什么疑問(wèn),可以參考《JavaScript實(shí)例自學(xué)手冊(cè):通過(guò)486個(gè)例子掌握Web開(kāi)發(fā)捷徑》(電子工業(yè)出版社,吳雪)和《JavaScript權(quán)威指南》(機(jī)械工業(yè)出版社)等書(shū)籍。
2.6 習(xí)題
一、常見(jiàn)面試題
1.JavaScript是否有專門對(duì)字符和字符串的處理?
【解析】本題具有一定的迷惑性,如果熟悉一些高級(jí)開(kāi)發(fā)語(yǔ)言,應(yīng)聘者可能知道高級(jí)語(yǔ)言是區(qū)分字符和字符串的處理的。而JavaScript語(yǔ)言并不區(qū)分,這一點(diǎn)讀者一定注意。
2.數(shù)據(jù)庫(kù)有空值嗎?JavaScript是否也有空值?
【解析】本題考查對(duì)基礎(chǔ)知識(shí)的了解,JavaScript中的null類型表示一個(gè)空值。可以使用null和一個(gè)變量進(jìn)行比較以測(cè)試該變量是否擁有內(nèi)容,通常用來(lái)判斷對(duì)象的創(chuàng)建或引用是否成功。
二、簡(jiǎn)答題
1.JavaScript的基本數(shù)據(jù)類型有哪些?
2.寫(xiě)出幾種常用的內(nèi)置對(duì)象。
3.什么是數(shù)組?它與基本的數(shù)據(jù)類型有什么關(guān)系?
三、綜合練習(xí)
1.編寫(xiě)一個(gè)程序,記錄學(xué)生的《高等數(shù)學(xué)》成績(jī)。要求集中輸出位于60~69、70~79、80~89和90~100各個(gè)分?jǐn)?shù)段的學(xué)生名字。
【提示】該題可以用一個(gè)數(shù)組記錄學(xué)生名字和分?jǐn)?shù),偶數(shù)元素保存學(xué)生的名字,奇數(shù)元素存儲(chǔ)學(xué)生的成績(jī)。遍歷數(shù)組時(shí)檢查元素索引的奇偶性即可分辨當(dāng)前元素是名字還是分?jǐn)?shù)。得到分?jǐn)?shù)值后判斷其所在分?jǐn)?shù)階段,其前一個(gè)數(shù)組元素即為得到該分?jǐn)?shù)的學(xué)生名字。將各分?jǐn)?shù)段的學(xué)生名字分別添加到相應(yīng)的變量,最后一并輸出,參考代碼如下:
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 var score = new Array( "王勇", 50, // 分?jǐn)?shù)表 04 "白露", 60, 05 "楊楊", 76, 06 "李明", 83, 07 "張莉莉", 70, 08 "楊宗楠", 71, 09 "徐霞", 66, 10 "楊玉婷", 93 11 ); 12 var namesOf_0To59 = ""; // 0~59分的學(xué)生名字串 13 var namesOf_60To69 = ""; // 60~69分的學(xué)生名字串 14 var namesOf_70To79 = ""; // 70~79分的學(xué)生名字串 15 var namesOf_80To89 = ""; // 80~89分的學(xué)生名字串 16 var namesOf_90To100 = ""; // 90~100分的學(xué)生名字串 17 var scoreSum = 0; // 全體總分計(jì)數(shù) 18 document.write( "<b>《高等數(shù)學(xué)》成績(jī)統(tǒng)計(jì)表</b><br>" ); // 標(biāo)題 19 for( index in score ) // 遍歷分?jǐn)?shù)數(shù)組 20 { 21 // 奇數(shù)索引元素為分?jǐn)?shù),其前一個(gè)元素即為該分?jǐn)?shù)的學(xué)生名字 22 if( index%2==1 ) // 分?jǐn)?shù) 23 { 24 // 判斷當(dāng)前分?jǐn)?shù)所在的分?jǐn)?shù)段并將學(xué)生名字存入相應(yīng)變量 25 if( (score[index]>=0) && (score[index]<=59) ) // 如果在分?jǐn)?shù)在0~59分間 26 { 27 namesOf_0To59 += score[index-1] + " "; // 組合名字 28 } 29 if( (score[index]>=60) && (score[index]<=69) ) // 如果在分?jǐn)?shù)在60~69分間 30 { 31 namesOf_60To69 += score[index-1] + " "; // 組合名字 32 } 33 if( (score[index]>=70) && (score[index]<=79) ) // 如果在分?jǐn)?shù)在70~79分間 34 { 35 namesOf_70To79 += score[index-1] + " "; // 組合名字 36 } 37 if( (score[index]>=80) && (score[index]<=89) ) // 如果在分?jǐn)?shù)在80~89分間 38 { 39 namesOf_80To89 += score[index-1] + " "; // 組合名字 40 } 41 if( (score[index]>=90) && (score[index]<=100) ) // 如果在分?jǐn)?shù)在90~100分間 42 { 43 namesOf_90To100 += score[index-1] + " "; // 組合名字 44 } 45 scoreSum += score[index]; // 統(tǒng)計(jì)總分 46 } 47 } 48 document.write( "<li>00~59分:" + namesOf_0To59 + "<br>" ); // 輸出0~59分的學(xué)生名字 49 document.write( "<li>60~69分:" + namesOf_60To69 + "<br>" ); // 輸出60~69分的學(xué)生名字 50 document.write( "<li>70~79分:" + namesOf_70To79 + "<br>" ); // 輸出70~79分的學(xué)生名字 51 document.write( "<li>80~89分:" + namesOf_80To89 + "<br>" ); // 輸出80~89分的學(xué)生名字 52 document.write( "<li>90~100分:" + namesOf_90To100 + "<br>" ); // 輸出90~100分的學(xué)生名字 53 // 數(shù)組元素個(gè)數(shù)除以2即為人數(shù),總分除以人數(shù)即得平均分 54 document.write( "<li>平均分 :" + scoreSum/(score.length/2) + "<br>" ); 55 --> 56 </script> <!--腳本程序結(jié)束-->
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,結(jié)果如圖2-19所示。
2.朱自清《荷塘月色》中有文段“采蓮南塘秋,蓮花過(guò)人頭;低頭弄蓮子,蓮子清如水。今晚若有采蓮人,這兒的蓮花也算得‘過(guò)人頭’了;只不見(jiàn)一些流水的影子,是不行的。這令我到底惦著江南了”?,F(xiàn)編寫(xiě)程序,將文中的“蓮”字加粗、用紅色標(biāo)記之。

圖2-19 運(yùn)行結(jié)果
【提示】使用String對(duì)象來(lái)處理題中的短文。多次調(diào)用charAt方法獲取文本中的每一個(gè)字符,判斷所取字符如果是“蓮”字就調(diào)用bold方法和fontcolor方法對(duì)其設(shè)置粗體和顏色。參考代碼如下:
01 <script language="javascript"> // 腳本程序開(kāi)始 02 <!-- 03 var comment = "采蓮南塘秋,蓮花過(guò)人頭;低頭弄蓮子,蓮子清如水。 // 選文 04 今晚若有采蓮人,這兒的蓮花也算得“過(guò)人頭”了;只不見(jiàn)一些流水的影子, 05 是不行的。這令我到底惦著江南了。" 06 var newComment = ""; // 處理過(guò)的字符集合 07 for( n = 0; n<comment.length; n ++ ) // 處理選文中的每一個(gè)字符 08 { 09 var curChar = comment.charAt( n ); // 取得一個(gè)字符 10 if( curChar=="蓮" ) // 若為“蓮”字時(shí) 11 { 12 newComment += (curChar.bold()).fontcolor("red"); // 加粗并設(shè)置紅色 13 } 14 else // 非“蓮”字 15 { 16 newComment += curChar; // 直接添加到已處理內(nèi)容 17 } 18 } 19 document.write("<li><b>原文:</b><br>" + comment + "<br>" ); // 輸出原文 20 document.write("<li><b>標(biāo)記“蓮”字:</b><br>" + newComment + "<br>" ); // 輸出新內(nèi)容 21 --> 22 </script> <!--腳本程序結(jié)束-->
【運(yùn)行結(jié)果】打開(kāi)網(wǎng)頁(yè)文件運(yùn)行程序,其結(jié)果如圖2-20所示。

圖2-20 運(yùn)行結(jié)果
四、編程題
1.寫(xiě)一個(gè)程序輸出當(dāng)前時(shí)間。
【提示】可以考慮使用時(shí)間函數(shù)。
2.寫(xiě)一個(gè)程序求一個(gè)數(shù)的平方根。
【提示】利用數(shù)學(xué)函數(shù)中的平方根函數(shù)即可輕松實(shí)現(xiàn)。
- 高效能辦公必修課:Word圖文處理
- 數(shù)據(jù)中心建設(shè)與管理指南
- Mobile DevOps
- 流處理器研究與設(shè)計(jì)
- 80x86/Pentium微型計(jì)算機(jī)原理及應(yīng)用
- Creo Parametric 1.0中文版從入門到精通
- INSTANT Drools Starter
- 工業(yè)機(jī)器人運(yùn)動(dòng)仿真編程實(shí)踐:基于Android和OpenGL
- 智能生產(chǎn)線的重構(gòu)方法
- 空間機(jī)械臂建模、規(guī)劃與控制
- INSTANT VMware vCloud Starter
- Building Google Cloud Platform Solutions
- 中老年人學(xué)電腦與上網(wǎng)
- 計(jì)算機(jī)辦公應(yīng)用培訓(xùn)教程
- 大數(shù)據(jù)時(shí)代的調(diào)查師