JavaScript 原型鍊

首先原型是什麼?

Willy
Oct 27, 2020

透過「原型」繼承可以讓原先沒有某個屬性的物件去存取其他物件的屬性。
物件中的原始的屬性和方法都放在這裡面,然後可以透過原型鍊繼承(給子物件)

所有實例對象(instance)需要共享的屬性和方法,都放在這個對象(protoype)裡面;那些不需要共享的屬性和方法,就放在構造函數(建構子)里面。

__proto__為"原型鍊",prototyp就是"原型",透過原型鍊指向原型。

constructor 構造函數 、建構子

建構子 命名第一個字通常會是大寫
對Person 設定原型 可繼承共用function (記憶體位置一樣,節省記憶體空間)
透過new 去建立instance
透過new 去建立instance
Jack 可以使用sayName 函式
Marry 可以使用sayName 函式
將sayName定義在prototype內,可以給new 出來的 instance (子物件)去共同使用,兩個sayName 相等但表位置相同,節省記憶體空間。

子物件透過本身的__proto__ 去鍊結父物件的 prototype原型

Jack 及 Marry 透過__proto__原型鍊 找到 Person 的原型 prototype
Person 透過__proto__原型鍊 找到Object 原型,最後Obeject 原型鍊指向null
Jack中沒有sayName 的函式 就會往上去找(透過__proto__)

所以當你呼叫一個method時,會透過原型鍊不斷往上找,直到 null 或者是找到真的擁有這個 method 的人為止

可用 hasOwnProperty 檢查屬性是屬於當前物件,還是位於原型串鏈中。

透過子物件修改prototype
因為記憶體位置相同所以Person 的sayName 也改變了

不要透過子物件中修改__proto__會將所有改變,也會不好維護,你會不知道在什麼時候__proto__被改變了

一般像array可用的函式 也是放在__proto__ 裡面

參考

--

--

Willy
Willy

Written by Willy

前端修練筆記本,記錄一些踩雷及學習過程,希望能順便幫助一些,在學習或開發路上卡關的人們。

No responses yet