JavaScript 資料類型，javascript資料類型

JavaScript 資料類型，javascript資料類型
JavaScript資料類型

 

一：簡介

 

再提資料類型是因為其與操作符結合、以及如何判斷一個變數是哪種類型時會有一些容易讓人疑惑的地方、比如資料類型與操作符組合之後的結果有時候並不是我們想象的那樣。再比如=、==與===有什麼區別。

 

二：隱式轉換

 

   下面的測試可以通過chrome瀏覽器的開發人員模式（按F12調出）的console中直接輸入、斷行符號後再輸入相應的變數名就可以很直觀的看到結果。

   JavaScript中比較兩個資料是否相同可以使用“==”或者“===”。前者在比較時如果兩個資料類型不同、則會做一定轉換再比較。後則為絕對相等、如果相比較的兩個物件類型不同則直接返回false。

隱式轉換見於兩個相比較對象對比時。

1. a===b:

1. 類型不同直接返回false、

2. 類型相同再進一步比較值是否相同、需要注意的是：如果是對象比較、JavaScript比較的是兩個對象的引用是否為同一引用、是則為true、否則為false。

3. null === null、undefined === undefined、NaN != NaN、new Object != new Object.

1. a==b :

1. 類型相同、與a===b等價。

2. 類型不同

   1. null與undefined相等

   2. number與String相比時String轉換成number

   3. Boolean與其他相比時、true轉換成1 false轉換成0.但是如果是先定義一個變數值為 1再與true做對比則結果為false。

   4. object與其他相比時、object轉為基本類型、其他false。

1. example：

var str1 = '12.5';var num1 = 12.5;console.info("str1 + num1 : " + (str1 + num1));console.info("str1 - num1 : " + (str1 - num1));console.info("str1 * num1 : " + (str1 * num1));console.info("str1 / num1 : " + (str1 / num1));console.info("=========================================\r\n");// string number interconversionvar strFromNum = 12.5 + "";console.info("strFromNum type : " + typeof strFromNum);var numFromStr = '12.5' - 0;console.info(("numFromStr type : " + typeof numFromStr));console.info("=========================================\r\n");// == examplevar str2 = '25.0';var str3 = new String('25.0');var num2 = 25.0;var num3 = 0;var num4 = 1;var booTrue = true;var booFalse = false;var arr1 = [1, 2];var arr2 = [1, 2];console.info("str2 == str3 : " + (str2 == str3));console.info("str2 == num2 : " + (str2 == num2));console.info("str3 == num2 : " + (str3 == num2));console.info("booTrue == num3 : " + (booTrue == num3));console.info("booFalse == num4 : " + (booFalse == num4));console.info("booTrue == 1 : " + (booTrue == 1));console.info("booFalse == 0 : " + (booFalse == 0));console.info("arr1 == arr2 : " + (arr1 == arr2));console.info("null == undefined : " + (null == undefined));console.info("NaN == NaN : " + (NaN == NaN));console.info("=========================================\r\n");// === exampleconsole.info("str2 === str3 : " + (str2 === str3));console.info("str2 === num2 : " + (str2 === num2));console.info("str3 === num2 : " + (str3 === num2));console.info("booTrue === num3 : " + (booTrue === num3));console.info("booFalse === num4 : " + (booFalse === num4));console.info("booTrue === 1 : " + (booTrue === 1));console.info("booFalse === 0 : " + (booFalse === 0));console.info("arr1 === arr2 : " + (arr1 === arr2));console.info("null === undefined : " + (null === undefined));console.info("NaN === NaN : " + (NaN === NaN));console.info("=========================================\r\n");

三：類型檢測

   

   JavaScript中可以通過一下幾種方式來判斷一個資料的類型：typeof、instanceof、Object.prototype.toString、constructor、duck type.

   1.typeof:

   a)適用於判斷基本類型和函數類型。

   b)typeof null結果為“Object”。

   c)typeof判斷數組、輸出結果為Object。

   example：

/*    要點：        1. 基本類型沒有屬性、方法        2. 調用基本類型會產生臨時封裝對象、調用完成之後封裝對象就被消耗、此時再想擷取基本類型的偽屬性就會返回undefined。 */var str4 = 'alien';console.info("str4.length : " + str4.length);console.info("str4.p : " + (str4.p = 'star'));console.info("str4.p : " + str4.p);console.info("=========================================\r\n");console.info("typeof 1: " + typeof 1);console.info("typeof '1': " + typeof '1');console.info("typeof boolean: " + typeof false);console.info("typeof null: " + typeof null);console.info("typeof undefined: " + typeof undefined);console.info("typeof [1, 2]: " + typeof [1, 2]);console.info("typeof Math: " + typeof Math);function fun (){}console.info("typeof fun: " + typeof fun);console.info("typeof NaN: " + typeof NaN);console.info("=========================================\r\n");

   2.instanceof

   a)適用於判斷被檢測類型屬於哪種物件類型——obj instanceof Object;

   b)其左邊的運算數是一個對象，右邊的運算數是對象類的名字或建構函式。如果 object 是 class 或建構函式的執行個體，則 instanceof 運算子返回 true。如果 object 不是指定類或函數的執行個體，或者 object為 null，則返回false。

   c)instanceof 不能跨iframe使用！不同iframe中建立的對象不會共用一個prototype。

   example:

 

console.info("[1, 2] instanceof Array : " + [1, 2] instanceof Array);function Person(){}function Student(){}Student.prototype = new Person();Student.prototype.constructor = Student;var alien = new Person();console.info("alien instanceof Person : " + alien instanceof Person);var student = new Student();console.info("student instanceof Person : " + student instanceof Person);console.info("=========================================\r\n");

   3.Object.prototype.toString.apply();

   通過對象的prototype判斷其具體類型、可用於判斷數群組類型

   example:

Object.prototype.toString.apply([]); //"[object Array]"Object.prototype.toString.apply(function(){}); //"[object Function]"Object.prototype.toString.apply(Math); //"[object Math]"Object.prototype.toString.apply(new Person()); //"[object Object]"Object.prototype.toString.apply(null); //"[object Null]"Object.prototype.toString.apply(NaN); //"[object Number]"Object.prototype.toString.apply('alien'); //"[object String]"Object.prototype.toString.apply(undefined); //"[object Undefined]"console.info("=========================================\r\n");

1. constructor 、通過構造器判斷類型、constructor可以被改寫、不經常用

2. duck type 鴨子類型、通過類型特有屬性或者方法來判斷資料類型、如判斷一個資料類型是否是數組可以查看此資料是否有length屬性等。

 

四：總結

 

   typeof：適合基本類型和function檢測、遇到null則失效。

   Object.prototype.toString.applay()判斷。

   instancof：適合自訂對象、也可以用來檢測原生對象、在不同iframe和window之間失效。

   後兩種不常用、視情況而定。

五：補充

    測試結果：

/* * Result : str1 + num1 : 12.512.5 str1 - num1 : 0 str1 * num1 : 156.25 str1 / num1 : 1 ========================================= strFromNum type : string numFromStr type : number ========================================= str2 == str3 : true str2 == num2 : true str3 == num2 : true booTrue == num3 : false booFalse == num4 : false booTrue == 1 : true booFalse == 0 : true arr1 == arr2 : false null == undefined : true NaN == NaN : false ========================================= str2 === str3 : false str2 === num2 : false str3 === num2 : false booTrue === num3 : false booFalse === num4 : false booTrue === 1 : false booFalse === 0 : false arr1 === arr2 : false null === undefined : false NaN === NaN : false ========================================= str4.length : 5 str4.p : star str4.p : undefined typeof 1: number typeof '1': string typeof boolean: boolean typeof null: object typeof undefined: undefined typeof [1, 2]: object typeof Math: object typeof fun: function */