判斷js中的類型：typeof / instanceof / constructor / prototype

標籤：javascript   prototype   繼承   對象   object   

如何判斷js中的類型呢，先舉幾個例子：

var a = "jason";

var b = 123;

var c = true;

var d = [1,2,3];

var e = new Date();

var f = function(){
    alert(‘jason‘);

};

一、最常見的判斷方法：typeof

    typeof是一個一元運算子，它返回的結果始終是一個字串，對不同的運算元，它返回不同的結果，另外typeof可以判斷function的類型；在判斷除Object類型的對象時比較方便。

console.log(typeof a == "string");        //true

console.log(typeof a == String);        //false

具體的規則如下：

  1) 對於數字類型的運算元而言， typeof 返回的值是 number。比如說：typeof 1，返回的值就是number。

    上面是舉的常規數字，對於非常規的數字類型而言，其結果返回的也是number。比如typeof NaN，NaN在JavaScript中代表的是特殊非數字值，雖然它本身是一個數字類型。

    在JavaScript中，特殊的數字類型還有幾種：

Infinity                     //表示無窮大特殊值

NaN                         //特殊的非數字值

Number.MAX_VALUE             //可表示的最大數字

Number.MIN_VALUE             //可表示的最小數字（與零最接近）

Number.NaN                     //特殊的非數字值

Number.POSITIVE_INFINITY    //表示正無窮大的特殊值

Number.NEGATIVE_INFINITY    //表示負無窮大的特殊值

    以上特殊類型，在用typeof進行運算進，其結果都將是number。

  2) 對於字串類型，typeof返回的值是string。比如typeof  "jason"返回的值是string。

  3) 對於布爾類型，typeof返回的值是boolean。比如typeof true返回的值是boolean。

  4) 對於對象、數組、null返回的值是object。比如typeof {}，typeof []，typeof null返回的值都是object。

  5) 對於函數類型，返回的值是function。比如：typeof eval，typeof Date返回的值都是function。

  6) 如果運算數是沒有定義的（比如說不存在的變數、函數或者undefined），將返回undefined。比如：typeof jason、typeof undefined都返回undefined。

console.log(typeof a);                    //string

console.log(typeof b);                    //number

console.log(typeof c);                    //boolean

console.log(typeof d);                    //object

console.log(typeof e);                    //object

console.log(typeof f);                    //function

console.log(typeof 1);                    //number

console.log(typeof NaN);                //number

console.log(typeof Number.MIN_VALUE);    //number

console.log(typeof Infinity);            //number

console.log(typeof "123");                //string

console.log(typeof true);                //boolean

console.log(typeof {});                    //object

console.log(typeof []);                    //object

console.log(typeof null);                //object

console.log(typeof eval);                //function

console.log(typeof Date);                //function

console.log(typeof sss);                //undefined

console.log(typeof undefined);            //undefined

二、判斷一個對象是否為某一資料類型，或一個變數是否為一個對象的執行個體：instanceof

    注意：instanceof 後面一定要是物件類型，並且大小寫不能錯，該方法適合一些條件選擇或分支。

console.log(d instanceof Array);        //true

console.log(e instanceof Date);            //true

console.log(f instanceof Function);        //true

三、根據對象的constructor判斷：constructor

console.log(d.constructor === Array)    //true

console.log(e.constructor === Date)        //true

console.log(f.constructor === Function)    //true

注意constructor在類繼承時會出錯

例如：

    function A(){};

    function B(){};

    var aObj = new A();

    console.log(aObj.constructor === A);    //true;

    console.log(aObj.constructor === B);    //false;
    

    function C(){};

    function D(){};

    C.prototype = new D(); //C繼承自D

    var cObj = new C();

    console.log(cObj.constructor === C);    //false;

    console.log(cObj.constructor === D);    //true;

    
而instanceof方法不會出現該問題，對象直接繼承和間接繼承的都會報true：

    console.log(cObj instanceof C);            //true

    console.log(cObj instanceof D);            //true

    

解決construtor的問題通常是讓對象的constructor手動指向自己：

    cObj.constructor = C;                     //將自己的類賦值給對象的constructor屬性

    console.log(cObj.constructor === C);    //true;

    console.log(cObj.constructor === D);    //false; 基類不會報true了;

    
    
四、通用但很繁瑣的方法：prototype    

    console.log(Object.prototype.toString.call(a) === ‘[object String]‘);        //true

    console.log(Object.prototype.toString.call(b) === ‘[object Number]‘);        //true

    console.log(Object.prototype.toString.call(c) === ‘[object Boolean]‘);        //true

    console.log(Object.prototype.toString.call(d) === ‘[object Array]‘);        //true

    console.log(Object.prototype.toString.call(e) === ‘[object Date]‘);            //true

    console.log(Object.prototype.toString.call(f) === ‘[object Function]‘);        //true

    註：大小寫不能寫錯，比較麻煩，但勝在通用。

總結：

    通常情況下用typeof判斷就可以了，遇到預知Object類型的情況可以選用instanceof或constructor方法，簡單總結下，歡迎補充！