圖文並茂的幫助你更好的理解JavaScript原型.熟記並理解以下規則,保你深入理解對象原型,保你面試無憂.
1. 任何對象都擁有__proto__(隱式原型)屬性,一般指向他們的構造函數的原型(prototype).
2. 原型鏈的頂端是Object.prototype，其__proto__為null
3. 所有函數都擁有prototype（顯式原型）屬性
4. 所有函數都是Function的實例
類似的十分容易就能理解
5. 更奇葩的來了，ObjectFunction Array 本身也都是一個函數，由於是最常用的，所以JavaScript幫我們實現了
6. 原型對象中又擁有constructor屬性,該屬性指向函數本身,這個好理解
7. 先普及一波原型鏈概念
如果想要找到一個對象的屬性,首先會先在自身查找,如果沒有,就會通過__proto__屬性一層層的向上查找,直到原型鏈的頂端Object.prototype(__proto__:null)這種通過某種紐帶(__proto__)將對象之間形成一種繼承關係這種關係呈現出一種鏈條的形狀 將這種鏈條稱之為原型鏈
8. 根據第6條可以推論得:
9. Function.prototype.__proto__=== Object.prototype
Function是一個特殊的例子他創造了所有的函數,但他自身也是一個函數,他自己同時也創造了自己此處見第 5條(感謝網友指出的錯誤)
下面配合幾張原型圖,幫助大家更好的理解.
構造函數創建對象字面量原型圖
當我們創建一個函數時原型如下:
構造函數創建對象字面量原型圖
完整對象字面量原型圖:
完整對象字面量原型圖
數組原型鏈
數組原型鏈
基本包裝類型原型鏈
基本包裝類型
其實所有的原型鏈規則都是根據上面的規則來的,只要能記住並理解,那麼你也就理解原型了
閱讀更多 渡一教育web前端開發 的文章
關鍵字: 編程語言 JavaScript 技術
