1. 程式人生 > >為什麼Object.prototype在Function的原型鏈上與Function.prototype在Object的原型鏈上都為true

為什麼Object.prototype在Function的原型鏈上與Function.prototype在Object的原型鏈上都為true

關於javascript的原型鏈有一個問題我一直很疑惑:
為什麼 Function instanceof Object 與 Object instanceof Function都為true呢?

Function instanceof Object // ->true
Object instanceof Function // ->true

先給個結論吧(函式a和物件b指什麼看下去就直到了):
Object instanceof Function的實質就是函式a在Object的原型鏈上;
Function instanceof Object的實質就是物件b在Function的原型鏈上。

Function與Object的原型鏈

我是看了這個圖才有所理解的:
(嚴格的說與本文相關的圖只是紅色框中的內容)

函式與物件的聯絡圖-你不知道的JavaScript(上卷)171頁截圖

ps:你不知道的JavaScript(上卷)171頁截圖

先來說說為什麼Object instanceof Function的結果為ture,即Function.prototype在Object的原型鏈上

Function這個內建函式的Function.prototype是一個函式a,因為函式同時也是物件,因此這個函式a也定義了apply、call、bind等屬性(或者說方法)。而Object的委託目標Object.proto正是這個函式a,因此Object instanceof Function的結果為ture。

再來說說為什麼Object.prototype在Function的原型鏈上,即Function instanceof Object為ture。

Object這個內建函式的Object.prototype是一個物件b,很多我們經常用到的屬性(或者說方法)如:toString、valueOf、hasOwnProperty、isPrototypeOf就是定義在物件b上的。從圖上可以看到,Function的委託目標竟然也是函式a(Function.prototype和Function.proto都指向函式a),而函式a的委託目標正是物件b,因此Function instanceof Object為ture。

到上面為止其實都只是看圖說話而已,關係都已經在圖上表示了,只是我覺得初看圖也不好理解,嘗試藉助文字加強對圖的理解而已。

簡單來說就是**Object instanceof Function其實就是說函式a在Object的原型鏈上,
Function instanceof Object就是說物件b在Function的原型鏈上。**

Function與Object的委託目標都是函式a,而函式a的委託目標是物件b。

以下是我簡化的圖:

Function與Object的原型鏈
Object instanceof Function的實質就是函式a在Object的原型鏈上;
Function instanceof Object的實質就是物件b在Function的原型鏈上。
現在看來,Object.prototype在Function的原型鏈上與Function.prototype在Object的原型鏈上都為true其實是一件挺自然的事。