1. 程式人生 > >javascript: instanceof 和 typeof 的區別

javascript: instanceof 和 typeof 的區別

鑑於ECMAScript 是鬆散型別的,因此需要一種手段來檢測給定變數的資料型別

typeof 操作符

typeof可以獲取一個變數的型別,它可以返回如下幾個型別:
"undefined" 如果這個值未定義
"boolean"
"string"
"object"這個值是物件或null 
"number"
"function"
console.log(typeof(123));    //number
console.log(typeof("123"));  //string

我們可以使用typeof 來獲取一個變數是否存在,如:

var arr = new Array
(); if(typeof arr != "undefined"){ statement; }

如果使用 if(arr)a 如果arr不存在,則會報錯,對於array,null等特殊物件,typeof一律返回object,這是typeof的侷限性

instanceof 操作符

如果需要獲取一個物件是不是陣列或者其他型別,ECMAScript引入了另一個Java運算子instanceof 來解決這個問題

instanceof 常規用法

var arr = new Array();
if(arr instanceof Array){
    console.log(true
); }else{ console.log(false); }//true if(arr instanceof Object){ console.log(true); }else{ console.log(false); }//true

注:arr instanceof Object 得到true並不是因為Array是Object 的子物件,而是因為Array的prototype屬性屬於Object,Array的父級是Function

instanceof 在繼承關係中判斷一個例項是否屬於它的父型別

//! 判斷 fun1 是否是 fun2類的例項。並且是否使其父型別的例項
function InFun(){} function Fun1(){} Fun1.prototype = new InFun(); //原型繼承 var fun2 = new Fun1(); console.log(fun2 instanceof Fun1);//true console.log(fun2 instanceof InFun);// true

以上程式碼判斷了一層繼承關係中的父類,在多層繼承關係中,同樣適用

複雜點的 instanceof 的使用

console.log(Object instanceof Object);    //true 
console.log(Function instanceof Function);//true 
console.log(Number instanceof Number);    //false 
console.log(String instanceof String);    //false 

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

console.log(fun2 instanceof Function);    //true 
console.log(fun2 instanceof fun2);        //false

看了上面的程式碼是不是又暈頭轉向了?為什麼 Object 和 Function instanceof 自己等於 true,而其他類 instanceof 自己卻又不等於 true 呢?如何解釋?要想從根本上了解 instanceof 的奧祕,需要從兩個方面著手:
1,語言規範中是如何定義這個運算子的。
2,JavaScript 原型繼承機制。