理解Javascript_07_理解instanceof實現(xiàn)原理
更新時間:2010年10月15日 23:49:36 作者:
在《Javascript類型檢測》一文中講到了用instanceof來用做檢測類型,讓我們來回顧一下

那么instanceof的這種行為到底是如何實現(xiàn)的呢,現(xiàn)在讓我們揭開instanceof背后的迷霧。
instanceof原理
照慣例,我們先來看一段代碼:
復制代碼 代碼如下:
function Cat(){}
Cat.prototype = {}
function Dog(){}
Dog.prototype ={}
var dog1 = new Dog();
alert(dog1 instanceof Dog);//true
alert(dog1 instanceof Object);//true
Dog.prototype = Cat.prototype;
alert(dog1 instanceof Dog);//false
alert(dog1 instanceof Cat);//false
alert(dog1 instanceof Object);//true;
var dog2= new Dog();
alert(dog2 instanceof Dog);//true
alert(dog2 instanceof Cat);//true
alert(dog2 instanceof Object);//true
Dog.prototype = null;
var dog3 = new Dog();
alert(dog3 instanceof Cat);//false
alert(dog3 instanceof Object);//true
alert(dog3 instanceof Dog);//error
讓我們畫一張內(nèi)存圖來分析一下:

內(nèi)存圖比較復雜,解釋一下:
程序本身是一個動態(tài)的概念,隨著程序的執(zhí)行,Dog.prototype會不斷的改變。但是為了方便,我只畫了一張圖來表達這三次prototype引用的改變。在堆中,右邊是函數(shù)對象的內(nèi)存表示,中間的是函數(shù)對象的prototype屬性的指向,左邊的是函數(shù)對象創(chuàng)建的對象實例。其中函數(shù)對象指向prototype屬性的指針上寫了dog1,dog2,dog3分別對應Dog.prototype的三次引用改變。它們和棧中的dog1,dog2,dog3也有對應的關系。(注:關于函數(shù)對象將在后續(xù)博文中講解)
來有一點要注意,就是dog3中函數(shù)對象的prototype屬性為null,則函數(shù)對象實例dog3的內(nèi)部[[prototype]]屬性將指向Object.prototype,這一點在《理解Javascript_06_理解對象的創(chuàng)建過程》已經(jīng)講解過了。
結(jié)論
根據(jù)代碼運行結(jié)果和內(nèi)存結(jié)構(gòu),推導出結(jié)論:
instanceof 檢測一個對象A是不是另一個對象B的實例的原理是:查看對象B的prototype指向的對象是否在對象A的[[prototype]]鏈上。如果在,則返回true,如果不在則返回false。不過有一個特殊的情況,當對象B的prototype為null將會報錯(類似于空指針異常)。
這里推薦一篇文章,來自于歲月如歌,也是關于instanceof原理的,角度不同,但有異曲同工之妙。
相關文章
javascript之分片上傳,斷點續(xù)傳的實際項目實現(xiàn)詳解
在本篇文章里小編給大家整理了關于javascript之分片上傳,斷點續(xù)傳的實際項目實現(xiàn)的詳細內(nèi)容,有需要的朋友們學習下。2019-09-09JavaScript常見的函數(shù)中的屬性與方法總結(jié)
當定義和調(diào)用函數(shù)時,JavaScript?函數(shù)對象會自動具有一些特定的屬性,本文為大家總結(jié)了一些常見的屬性和方法,感興趣的小伙伴可以了解一下2023-05-05如何在指定的地方插入html內(nèi)容和文本內(nèi)容
本文為大家介紹個小技巧可以在指定的地方插入html內(nèi)容和文本內(nèi)容,示例如下,感興趣的朋友可以參考下2013-12-12jQuery實現(xiàn)動態(tài)生成表格并為行綁定單擊變色動作的方法
這篇文章主要介紹了jQuery實現(xiàn)動態(tài)生成表格并為行綁定單擊變色動作的方法,涉及jQuery頁面元素遍歷與事件動態(tài)響應相關操作技巧,需要的朋友可以參考下2017-04-04