1. 程式人生 > >js中typeof和instanceof的基本用法以及區別

js中typeof和instanceof的基本用法以及區別

JavaScript 中 typeof 和 instanceof 通常都會用來判斷一個變數是否為空,或者是什麼型別的。但在具體使用中它們之間還是有區別的:

首先我們來說一下typeof的用法以及需要注意的地方:

typeof 是一個一元運算,放在一個運算數之前,這個運算數可以是任意的基本資料型別,而它的返回值是該運算數所對應的基本資料型別的字串
這也就是說typeof其實就是判斷引數是什麼型別的例項,就一個引數,返回值一般只能是如下幾個結果:
“number”、“string”、“boolean”、“object”、“function” 和 “undefined”。

運算數為數字 typeof(x) = "number" 

字串 typeof(x) = "string" 

布林值 typeof(x) = "boolean" 

物件,陣列和null typeof(x) = "object" 

函式 typeof(x) = "function" 

未賦值變數
	var a
 	typeof(a) = "undefined"

同樣的我們也可以利用typeof的這一特性來判斷一個變數是否存在,如:

var a = 5
if(typeof a! = "undefined"){
		alert("ok")         //因為我們定義變數a為5,即變數a為一個Number型別,所以輸出結果為 'ok'
	}else{
		alert('no')
	}

而不要去使用 if(a) 因為如果 a 不存在(未宣告)則會出錯,對於 Array,Null 等特殊物件使用 typeof 一律返回 object,這正是 typeof 的侷限性。
在這裡插入圖片描述

綜合我們可以看出,在JavaScript 中,通常我們會用 typeof 運算子來判斷一個變數是什麼型別的資料,但是如果我們希望獲取一個物件是否是陣列,或判斷某個變數是否是某個物件的例項則要選擇使用instanceof。如var a=new Array();alert(a instanceof Array);會返回true,同時alert(a instanceof Object)也會返回true;這是因為Array是object的子類。再如:function test(){};var a=new test();alert(a instanceof test)會返回true。

instanceof 運算子用來測試一個物件在其原型鏈中是否存在一個建構函式的 prototype 屬性。

我們先通過一段程式碼簡單瞭解一下instanceof的用法。

var a=new Array();  
alert(a instanceof Array)   // true
alert(a instanceof Object)  // true,這是因為Array是object的子類。

function test(){};  
var a=new test();   
alert(a instanceof test)  // true

以上,我們應該看到了一些typeof與instanceof的不同之處,從直觀的返回值上來看,instanceof 的返回值是一個布林值,當然了這也正符合了instanceof的描述:
instanceof 運算子用來檢測 constructor.prototype 是否存在於引數 object 的原型鏈上。


另外,更重的一點是 instanceof 可以在繼承關係中用來判斷一個例項是否屬於它的父型別。例如:

function Foo(){} 
Foo.prototype = new Aoo()   //JavaScript 原型繼承 
var foo = new Foo();
console.log(foo instanceof Foo)   //true 
console.log(foo instanceof Aoo)   //true

上面的程式碼中是判斷了一層繼承關係中的父類,在多層繼承關係中,instanceof 運算子同樣適用。

談到 instanceof 我們要多插入一個問題,就是 function 的 arguments,我們大家也許都認為 arguments 是一個 Array,但如果使用 instaceof 去測試會發現 arguments 不是一個 Array 物件,儘管看起來很像,這裡留給大家進行測試。

最後我們來看下面一段程式碼:

var a=new Array();
if (a instanceof Object){
		alert('Y')			//這裡輸出結果為'Y'
	}else{
		alert('N')      
	}

if (window instanceof Object){ 
		alert('Y')
	}else {
		alert('N')			//這裡輸出結果為'N'
	}

看到這裡大家應該明白了,這裡的 instanceof 測試的 object 是指 js 語法中的 object,不是指 dom 模型物件。如果這裡使用 typeof則會有些區別
在這裡插入圖片描述