前言

今天我們將講解JavaScript的Prototype chain（原型鏈），解釋其作用方式

說明

昨天講解了JavaScript Inheritance（原型繼承），今天則要來講解其背後作用的原理Prototype chain

透過Prototype chain讓inheritance得以實現

舉例:

let array = [1, 2, 3];
let array2 = array.map((x) => x*2);
console.log(array2); // [2, 4, 6];

問題: 為何array能使用map function? (在程式碼中，我們並沒有定義map function)

在MDN查詢map method時，則會出現prototype字樣
為何呢?

其實Map function是已經定義在array prototype中，再透過原型鏈(Prototype Chain)繼承給array使用

let array = [1, 2, 3];
let array2 = array.map((x) => x*2);

console.log(array) 
// 0: 0
// 1: 1
// 2: 2
// length: 3
// __proto__: Array(0)

那array prototype的prototype又為何呢?

console.log(array.__proto__) // [[Prototype]]: Object (結果是Object prototype)
console.log(array.__proto__.__proto__) // __proto__ : null

一路往上查詢後最終得到的prototype是null

每一個物件都有Prototype(原型)，這種一個牽一個、層層相依的從屬關係，就是原型鏈（Prototype Chain）

Prototype chain像是祖譜一樣，會一路繼承下來，讓子輩能繼承父輩的『屬性和方法』，就像家族後代可以繼承家族財產和傳統一樣