JavaScript高階程式設計（第3版）學習筆記3 js簡單資料型別

首頁

web前端

js教程

JavaScript高階程式設計（第3版）學習筆記3 js簡單資料型別_基礎知識

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

May 16, 2016 pm 05:49 PM

ECMAScript是一种动态类型的语言，构建于5种简单数据类型（Undefined、Null、Boolean、Number、String）和一种复杂数据类型（Object）的基础之上。这篇文章就来复习一下简单数据类型，我会尽量从编程实践的角度来描述，下面代码运行环境为FireFox 14.0.1。

简单数据类型

简单数据类型	取值
Undefined	undefined（只有一个值）
Null	null（只有一个值）
Boolean	true\|false（只有两个值）
Number	数值
String	字符串

　　首先需要說明的是，在ECMAScript中，上述5種簡單資料類型，其中Boolean、Number、String都有同名的內建包裝對象，而簡單資料類型的字面值（變數）會根據情況自動包箱，因此可以直接呼叫方法，至於具體可以呼叫哪些方法，在討論內建物件時再詳細說明：

複製程式碼程式碼如下:

 
console.info(true.toString());//true,相當於使用Boolean()包裝之後再呼叫
console.info(Boolean(false).toString( ));//false，將false轉換為Boolean類型值
console.info(new Boolean(false).toString());//false，false使用Boolean()包裝
console.info( false.toString());//false，相當於使用Boolean()包裝之後再呼叫
console.info('test'.toString());//test，相當於使用String()包裝之後再呼叫

try{ 
console.info(undefined.toString());//沒有對應包裝類型，拋出例外
}catch(e){ 
console.info(e );//TypeError 
} 
try{ 
console.info(null.toString());//沒有對應包裝類型，拋出例外
}catch(e){ 
 console.info(e);//TypeError 
} 

var num = 4; 
console.info(num.toString());//4，可以直接在簡單數值變數上呼叫方法，相當於使用Number()包裝之後再呼叫
//console.info(3.toString());//SyntaxError,語法錯誤不能使用try捕獲，說明不能直接在數值字面量上呼叫

其次說一下實際用的最多的資料轉換：
　　（1）轉換為Boolean：!!value
　　（2）轉換為Number：value
　（3）為String：'' value
　　下面再具體說明5種簡單資料類型：
1、Undefined類型
　　Undefined資料類型只有一個取值：undefined。
（1）所有未初始化的值都預設為undefined（也就沒有必要把一個變數顯示初始化為undefined了）。
（2）在函數作用域中，沒有傳入實際參數的函數形參為undefined。
（3）函數沒有明確回傳或return;的時候，回傳值為undefined。
（4）在ECMAScript中，規定null==undefined回傳true，而null===undefined回傳false。
（5）undefined對應的Boolean值為false。
（6）使用typeof作用於undefiend時，傳回字串'undefined'，作用於一個從未宣告的「變數」時，也會傳回'undefined'。
（7）undefined轉換數值為NaN，轉換字串為'undefined'。

複製程式碼程式碼如下:

 
console.info(undefined===undefined===undefined); /true 
console.info(typeof undefined);//undefined 
console.info(typeof noDefined);//undefined，未定義的標識符，使用typeof也傳回undefined，這也是未定義的標識符唯一可用的的運算子
console.info(!undefined);//true，這裡傳回true，正是許多條件語句中判斷變數是否初始化的基礎
console.info(!!undefined);/ /任何一個值，使用雙重否定!!都會將其轉換為對應的Boolean值，這裡說明undefiend對應的Boolean值為false 
console.info(undefined==null);//ES中規定，null與undefined相等性測試回傳true 
console.info(undefined===null);//但undefined與null畢竟是兩個資料型，使用全等比較時，回傳false 
console.info(typeof undefined ==undefined);//false，typeof undefined回傳的是一個字串'undefined'，所以這裡輸出false 
console.info( undefined);//NaN,轉換數值時為NaN 
console.info ('' undefined);//undefined，轉換為字串'undefined' 

2、Null型別
　　Null型別也只有一個值：null。
（1）對null值使用typeof時，傳回字串'object'。
（2）null對應的Boolean值為false。
（3）如果一個變數用來保存一個對象，建議初始化為null。
（4）null轉換數值為0，轉換字串為'null'。

複製程式碼程式碼如下:

 
console.info(null===nullull); /true 
console.info(typeof null);//object 
console.info(!null);//true 
console.info(!!null);//false,說明null對應的Boolean值為false 
console.info(undefined==null);//true 
console.info(undefined===null);//false 
console.info( null);//0 ，轉換為數值0 
console.info('' null);//null，轉換為字串'null' 

3、Boolean类型
　　Boolean类型只有两个值：true和false。
（1）虽然只有两个值，但是任何一种数据类型的值都能转换为与其相对应的Boolean值，转换方式主要有三种：
　　A、通过转型函数Boolean()转换
　　　　需要注意的是，当Boolean()作为转换函数时，会转换为一个与其相应的Boolean值，当作为构造函数时，会创建一个对象，而任意非空对象的Boolean值都是true，有时候这会造成误解，建议就是不使用Boolean()。对于String()、Number()也有类似情况。
　　B、通过双重否定!!操作符转换
　　C、通过隐式转换，比如一些条件语句中
（2）Boolean类型的true和false，使用typeof时，均返回字符串'boolean'。
（3）在转换为数值时，true和false分别转换为1和0，转换为字符串时，分别为'true'和'false'。

复制代码代码如下:

 
var value = 'test'; 
var empty = ''; 
console.info(!!value);//true 
console.info(!!empty);//false 
console.info(Boolean(value));//true 
console.info(Boolean(empty));//false 
console.info(!!value === Boolean(value));//true，说明两种转换方式等价 
console.info(!!empty === Boolean(empty));//true 
console.info(new Boolean(value));//Boolean对象，注意这里使用了new，会创建一个对象 
console.info(new Boolean(empty));//Boolean对象 
if(value){//隐式转换为true 
console.info(value);//test 
} 
if(empty){//隐式转换为false，不执行括号内部语句 
console.info('empty'); 
} 
if(new Boolean(empty)){//先创建对象，再隐式转换为true，会执行括号内部的语句 
console.info('empty');//empty 
} 
console.info(typeof true == 'boolean');//true 
console.info(+true);//1，一元操作符，转换为数值1 
console.info(+false);//0 
console.info(''+true);//true，重载后的+操作符，转换为字符串'true' 
console.info(''+false);//false 

具体的转换规则如下：

数据类型	转换为true的值	转换为false的值
Undefined	-	undefined
Null	-	null
Boolean	true	false
Number	任意非0数值（包括无穷大）	0和NaN
String	任意非空字符串	空字符串
Object	任意对象	-

4、Number型

　　在ECMAScript中，沒有單獨的整型、浮點型，只有一個Number型，使用IEEE754格式來表示（這種表示法在計算時會有捨入誤差），在這裡不去細究底層實現，這些東西在學校學C語言的時候已經很頭痛了，不想再頭痛一次。下面我把實際編程中用的最多的放到最前面來講，這一般來說已經足夠，對於不想被太邊緣的細節所困擾的朋友，隨時可以跳過後面關於Number的論述。

（1）數值轉換：主要是下面的三個轉換函數

Number()函數：和Boolean()類似，將資料轉換成Number型，和使用一元加運算子（）作用相同，建議使用運算符，比較簡單。
parseInt()函數：解析整數，可以傳入資料和進制，如parseInt('070',8)輸出10進制的56。
parseFloat()函數：解析浮點數，只能接受一個參數，需要注意的是，如果被解析的資料結果是整數，會直接傳回整數。

註：使用Number()和轉換時，true—>1，false—>0，undefined—>NaN，null—>0，空字串—>0，非空字串—>依數值解析。

複製程式碼程式碼如下:

 
var trueVal = true; falseVal = false; 
var undef = undefined; 
var nullVal = null; 
var intVal = '1'; 
var floatVal = '1.0'; 
var strVal🎜>var floatVal = '1.0'; 
var strVal = 'test'; 
var empty = ''; 
console.info(Number(trueVal));//1 
console.info(Number(falseVal));//0 
console.info(Number( undef));//NaN 
console.info(Number(nullVal));//0 
console.info(Number(intVal));//1 
console.info(Number(floatVal) );//1 
console.info(Number(strVal));//NaN 
console.info(Number(empty));//0 

console.info( trueVal); //1 
console.info( falseVal);//0 
console.info( undef);//NaN 
console.info( nullVal);//0 
console.info( intVal );//1 
console.info( floatVal);//1 
console.info( strVal);//NaN 
console.info( empty);//0 

 console.info(parseInt(trueVal));//NaN 
console.info(parseInt(falseVal));//NaN 
console.info(parseInt(undef));//NaN 
console. info(parseInt(nullVal));//NaN 
console.info(parseInt(intVal));//1 
console.info(parseInt(floatVal));//1 
console.info( parseInt(strVal));//NaN 
console.info(parseInt(empty));//NaN 

console.info(parseFloat(trueVal));//NaN 
console.info(parseFloat(trueVal));//NaN 
console.info(parseFloat(trueVal));//NaN 
console.info (parseFloat(falseVal));//NaN 
console.info(parseFloat(undef));//NaN 
console.info(parseFloat(nullVal));//NaN 
console.info(parseFloat (intVal));//1 
console.info(parseFloat(floatVal));//1 
console.info(parseFloat(strVal));//NaN 

console.info(parseFloat(empty ));//NaN

說明：這些轉換函數的行為可能會因為瀏覽器的不同實作而不同，建議在實際程式設計過程中對存有疑問的先自行編寫測試。在《JavaScript高階程式設計（第3版）》中，這一節描述的也有很多地方和我實際運行的結果不同，例如原書說parseInt()只能解析字串，但下面的程式碼也可以執行：複製程式碼

 程式碼如下:

var object = { 

var object = { 
value:1, 
toString:function(){

return this.value; } }; console.info(parseInt(object));//1
（2）整數與浮點數：受C語言薰陶的人，一定要固執的區分一下整數和浮點數吧！在ECMAScript中，他們沒有預想的那麼有差別，簡單點，含有小數點且小數點後至少有一位不是0的數值就是浮點數，否則就是整數，比如1.01是浮點數，1.、1.00因為小數點後沒有不是0的數，引擎會解析成整數1。你可能會設想兩個整數相除結果也會取整吧，例如3 / 2 = 1，但是在ECMAScript中，不要擔心這些，已經還原其數學屬性了，你會發現3 / 2 = 1.5了，這一點，在運算子相關部分還會再提及。

（3）進位：也稱進位制，實際上就是進位（低位向高位）的方法，每種進位都有一個基數，當低位數值達到這個基數時，就向高位進1。在日常生活中，用的最多的自然是10進制，例如10角就進位為1元，在時間度量中，還有24進制（24小時為1天）、60進制（60秒為1分），在古代，也有使用16進制的（想想半斤八兩吧）。但是在計算機的處理中，由於電流只有通和不通兩種狀態，所以只能處理2進制數據，不過這對自然人來說不好理解，於是又使用8進制、16進製作為10進制和2進制轉換的中間狀態。

　　在ES3中，可以使用8進制、10進制、16進制，但是在ES5中，8進制已經被禁用了。

　　8進位：以1位數字0開始，後面是8進位數字序列（0~7），如果數字超過了7，會忽略前導0而作為10進位處理，例如08會解析為10進制的數字8。

　　16進位：以1位數字0和1個字母x開始，後面是16進位數字序列（0-9a-fA-F）。

　　10進位：可以直接將所有數字一一寫出來，也可以使用科學計數法（不明白？找一本中學數學教科書來看吧）來表示。

（3）特殊值：在ECMAScript中，有2個特殊的數值NaN和Infinity需要注意一下，前者表示不是一個數值（Not a Number），後者表示不在表示範圍內的數值，也可以使用正負號表示方向。對於這兩個特殊值，這裡不去考察具體的運算規則（你若有興趣，可以自行測試，我在下面也會舉一些例子），只做如下兩點說明：

　　A、不能用val==NaN來判斷一個變數是否為NaN，而要使用全域的isNaN()函數，函數接受一個參數，當參數可以轉換為數值時傳回true，否則回傳false。

　　B、盡量不要使用val==Infinity判斷是否超出範圍，而使用全域的isFinite()函數，該函數接受一個參數，當參數數值處於表示範圍內時傳回true，否則傳回false。這裡所說的表示範圍是指從Number.MIN_VALUE到Number.MAX_VALUE，另外，在Number裡面，還有屬性Number.NEGATIVE_INFINITY和Number.POSITIVE_INFINITY，其值分別為Infinity和 -Infinity。

複製程式碼程式碼如下:

 
console.info(0/0); //NaN 
console.info(NaN==NaN);//false 
console.info(NaN 1);//NaN 
console.info(NaN/NaN);//NaN 

var notNumber = NaN; 
console.info(notNumber==NaN);//false 
console.info(isNaN(notNumber));//true 
console.info(1/0); //Infinity 
console.info(-1/0); //-Infinity 
console.info(1/Infinity);//0 
console.info(Infinity/Infinity);//NaN 
console.info(Infinity==Infinity); //true 
var inf = Infinity; 
console.info(inf==Infinity);//true 
console.info(!isFinite( inf));//true 
console.info(!isFinite(NaN));//true 
console.info(isNaN(Infinity));//false 

註：在《JavaScript高級程式設計（第3版）》中第29頁說任何數值除以0都會回傳NaN，實際上並非如此。

5、String類型

　　和一般類C語言不同，在ECMAScript中，沒有字元類型，而將字串類型String作為一種簡單類型，其字面量使用引號（單引號'或雙引號“）括起來。

（1）對於字串類型的操作，加號“ ”被重載，任意一個數值與字串相加，都會先將其使用String( )轉換成字串，然後將兩個字串合併。 false—>'false'，數值類型Number—>以數值可見的字元轉換，物件Object—>呼叫toString。 🎜> 程式碼如下:

console.info('' 1 1);//11，而不是2

console.info('' true);//true console .info('' undefined);//undefined console.info('' null);//null

（3）字串使用反斜線「」來轉義，常見的一些轉義字元有：

字面量	含义	字面量	含义
n	换行	\	反斜杠
t	制表	'	单引号
b	空格	"	双引号
r	回车	xnn	以十六进制代码nn表示的一个字符
f	进纸	unnnn	以十六进制代码nnnn表示的一个Unicode字符