javascript的原型鏈那些事
如果你對javascript的原型鏈還有任何疑問,請看這篇文章
進入主題
前言
- 原型鏈的規則不百分百適用于所有情況
- 顯式原型:prototype,是一個對象{}
- 隱式原型:__proto__,是一個對象的屬性
原型鏈規則
- 任何一個引用類型的對象都有一個__proto__屬性指向它的構造函數的prototype(也就是構造函數的原型對象,注意原型對象是一個{}類型)
- 只有函數類型的對象才有prototype屬性,該屬性的屬性值指向該函數的原型對象。
- 當對象上不存在要尋找的屬性或方法時,js會順著隱式原型找當前對象的構造函數的顯示原型對象上是否存在需要的屬性或方法,如果仍然沒有,會一直想上找,直到碰到null結束。
關鍵說明
const dad = function(){}
const instance = new dad()
根據規則,很容易得出下面兩條結論:
- dad為函數類型,所以dad上存在prototype屬性,屬性值為一個對象,我們稱它為dad的原型對象
- instance為dad的一個實例,是對象類型,因此instance上面會有一個__proto__屬性,屬性值為dad.prototype
接下來思考,dad.prototype也是一個對象類型,對象類型是由Object()構造函數構造出來的,dad是引用類型,所以也有一個隱式原型屬性,那么我們應該也能得出下面的結論:
- dad.prototype.__proto__ === Object.prototype
- dad.__proto__ === Function.prototype
Okay,按照規則接著向上走,那么會得到以下結論:
Object.prototype.__proto__ === Object.prototypeFunction.prototype為對象類型
但是,上面的結論不正確了,因為Object函數與Function函數比較特殊,不遵守我們總結的規則。那么他們應該等于什么呢?
- Object.prototype.__proto__ === null
- Function.prototype為[native code]的底層函數,用于javascript構建初始函數
- Function.prototype.__proto__ === Object.prototype
- Function.__proto__ === Funtion.prototype
可以看出,js讓Object構造函數的原型對象的隱式原型最終指向null,否則會造成循環引用死循環。這樣順著原型鏈找最后一定會走到終點null;對于Function,它的構造函數是它本身,所以Function的原型對象和隱式原型相等。除此之外js讓Function的原型對象的隱式原型也指向Object構造函數的原型對象,這樣終點也會走到null。
結尾
到此,整個原型鏈全部走通,下面放出一張簡單的圖解,幫助理解生硬的文字。如果還有什么問題,可以發表評論,互相交流。


浙公網安備 33010602011771號