JavaScript中isPrototypeOf函式
目錄
- 1、isPrototypeOf()
- 示例1,Object類例項:
- 示例2,自己定義Human類:
- 示例3,再來看看Object的原型(prototype)是否是human的原型:
- 示例4,Object.prototype是否是內建類的原型:
- 示例5,Object也是函式(類):
- 2、和 instanceof 的區別
有時看一些框架原始碼的時候,會碰到 isPrototypeOf()
這個函式,那麼這個函式有什麼作用呢?
1、isPrototypeOf()
isPrototypeOf()
是 Object
函式(類)的下的一個方法,用於判斷當前物件是否為另外一個物件的原型,如果是就返回 true
,否則就返回 false
這個函式理解的關鍵是在原型鏈上,這個據說是的三座大山之一。
這裡不詳述其中的原理,簡單的來講就是3點:
- 1. 函式物件,都會天生自帶一個
prototype
原型屬性。 - 2. 每一個物件也天生自帶一個屬性
__proto__
指向生成它的函式物件的prototype
。 - 3. 函式物件的
prototype
也有__proto__
指向生成它的函式物件的prototype
。
示例1,Object類例項:
let o = new Object(); console.log(Object.prototype.isPrototypeOf(o)); // true
因為o
物件是Object
(__proto__)
指向Object
的原型(prototype
),上面會輸出true。
示例2,自己定義Human類:
function Human() {} let human = new Human(); console.log(Human.prototype.isPrototypeOf(human)); // true
這例和上例類似,因為human
物件是Human
的例項,所以human
物件的原型(__proto__)
指向Human
的原型(prototype
),上面會輸出true
。
示例3,再來看看Object的原型(prototype)是否是human的原型:
console.log(Object.prototype.isPrototypeOf(human)); // true
為什麼呢?,用程式碼可能更好解釋,請看下面推導:
// 因為 Human 的原型(prototype)中的原型(__proto__)指向 Object 的原型(prototype) Human.prototype.__proto__ === Object.prototype // 又因為 human 的原型(__proto__)指向 Human 的原型(prototype) huamn.__proto__ === Human.prototype // 所以human物件的原型(__proto__)的原型(__proto__)指向Object的原型(prototype) huamn.__proto__.__proto__ === Object.prototype
如果檢視human的結構就很容易清楚了:
那 Object
的原型(prototype
) 是不是就是 human
物件的原型呢?確切的說Object
的原型(prototype
)是在 human
的原型鏈上。
示例4,Object.prototype是否是內建類的原型:
Script
中內建類Number
、String
、Boolean
、Function
、Array
因為都是繼承Object
,所以下面的輸出也都是true
:
console.log(Object.prototype.isPrototypeOf(Number)); // true
console.log(Object.prototype.isPrototypeOf(String)); // true
console.log(Object.prototype.isPrototypeOf(Boolean)); // true
console.lhttp://www.cppcns.comog(Object.prototype.isPrototypeOf(Array)); // true
console.log(Object.prototype.isProteZePLnWBQotypeOf(Fuwww.cppcns.comnction)); // true
自然Object.prototype
也是Number
、String
、Boolean
、Function
、Array
的例項的原型。
示例5,Object也是函式(類):
另外值得一提的是 Function.protothttp://www.cppcns.comype
也是Object
的原型,因為Object
也是一個函式(類),它們是互相生成的。
請看下面輸出:
console.log(Object.prototype.isPrototypeOf(Function)); // true
console.log(Function.prototype.isPrototypeOf(Object)); // true
2、和 instanceof 的區別
instanceof
是用來判斷物件是否屬於某個物件的例項。
例如:
function Human() {} let human = new Human(); // human 是 Human 的例項,所以結果輸出true console.log(human instanceof Human); // true // 因為所有的類都繼承Object,所以結果也輸出true console.log(human instanceof Object); // true // 因為 human 物件不是陣列,所以結果輸出false console.log(human instanceof Array); // false
再來一些內建類的例子:
// 【1,2,3] 是 Array 的例項,所以輸出true console.log([1,3] instanceof Array); // true // 方法 function(){} 是 Function的例項,所以輸出true console.log(function(){} instanceof Function);
instanceof
作用的原理就是判斷例項的原型鏈中能否找到類的原型物件(prototype),而 isPrototypeOf
又是判斷類的原型物件(prototype
)是否在例項的原型鏈上。
所以我的理解,這兩個表達的意思是一致的,就是寫法不同,下面兩個輸出應該是一致的:
console.log(A instanceof B); console.log(B.prototype.isPrototypeOf(A));
小結
其實要理解 isProtwww.cppcns.comotypeOf
函式,關鍵是要理解原型鏈這個玩意。
到此這篇關於JavaScript
中isPrototypeOf
函式的文章就介紹到這了,更多相關JavaScript中isPrototypeOf內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!