又介紹一個老朋友——instanceof。
對於值型別,你可以通過typeof判斷,string/number/boolean都很清楚,但是typeof在判斷到引用型別的時候,返回值只有object/function,你不知道它到底是一個object物件,還是陣列,還是new Number等等。
這個時候就需要用到instanceof。例如:
上圖中,f1這個物件是被Foo建立,但是“f1 instanceof Object”為什麼是true呢?
至於為什麼過會兒再說,先把instanceof判斷的規則告訴大家。根據以上程式碼看下圖:
Instanceof運算子的第一個變數是一個物件,暫時稱為A;第二個變數一般是一個函式,暫時稱為B。
Instanceof的判斷隊則是:沿著A的__proto__這條線來找,同時沿著B的prototype這條線來找,如果兩條線能找到同一個引用,即同一個物件,那麼就返回true。如果找到終點還未重合,則返回false。
按照以上規則,大家看看“ f1 instanceof Object ”這句程式碼是不是true? 根據上圖很容易就能看出來,就是true。
通過上以規則,你可以解釋很多比較怪異的現象,例如:
這些看似很混亂的東西,答案卻都是true,這是為何?
正好,這裡也接上了我們們上一節說的“亂”。
上一節我們們貼了好多的圖片,其實那些圖片是可以聯合成一個整體的,即:
看這個圖片,千萬不要嫌煩,必須一條線一條線挨著分析。如果上一節你看的比較仔細,再結合剛才我們們介紹的instanceof的概念,相信能看懂這個圖片的內容。
看看這個圖片,你也就知道為何上面三個看似混亂的語句返回的是true了。
問題又出來了。Instanceof這樣設計,到底有什麼用?到底instanceof想表達什麼呢?
重點就這樣被這位老朋友給引出來了——繼承——原型鏈。
即,instanceof表示的就是一種繼承關係,或者原型鏈的結構。請看下節分解。
(注:本節的圖片來源於http://www.ibm.com/developerworks/cn/web/1306_jiangjj_jsinstanceof/figure1.jpg)
---------------------------------------------------------------------------
本文已更新到《深入理解javascript原型和閉包系列》的目錄,更多內容可參見《深入理解javascript原型和閉包系列》。
另外,歡迎關注我的微博。
學習作者教程:《前端JS高階面試》《前端JS基礎面試題》《React.js模擬大眾點評webapp》《zepto設計與原始碼分析》《json2.js原始碼解讀》