# JS 物件與原型鍊
###### tags: `JavaScript`

## JS

### JavaScript 並不像 Java、C++ 這些物件導向語言具有「類別」（class）來區分概念與實體（instance）或天生具有繼承的能力

### JS 任何的內容都是以<font color='red'>物件</font>的形式做建立

## 物件原型

在實作中如果我們創建一個陣列，如果要把陣列內容都 console 出來，我們會想用 forEach 這個 array function 來做出來

let array1=[4,5,6];

array1.forEach(item => {
    console.log(item); // 4,5,6
})

由於常常下意識知道陣列有這些 function ， 但是換個角度想我明明沒有寫一個 forEach 的函式給 array 用為什麼可以直接用呢?

我們直接把陣列印出來


**圖上出現的 Prototype 就是 原型物件**

## 原型繼承 & 原型鍊

我創建了一個 array1 的陣列，實質上他是繼承了一個叫做 Array 的原型物件 ( 你可以看到 Prototype 旁邊有一個 Array )

而 Array 實質上也是繼承了 object 這個原型，我們可以在 console.log(array1) 的 Prototype 往下看還有一個 Prototype: Object


我們用圖來理解


* 我們創建了這個 array1 這個實體物件，他的 Prototype(原型) 是 Array

* Array 物件的 Prototype(原型) 是 Object

* Object 的 prototype(原型) 是 null

**原型繼承代表說 我們創立的物件都可以使用繼承原型來的方法與屬性**
**JavaScript 每一個物件都會有它的原型物件**

## 原型鍊 ( Prototype chain ):

每一個物件都有原型，這樣一個牽一個、層層相依的從屬關係 也就是上圖的綠線

## 最頂層的原型物件: Object.prototype (物件)

JavaScript 幾乎所有的物件 (環境宿主物件除外) 順著原型鏈找到最頂層級時，都會找到 Object.prototype 才停止

所以 Object.prototype 提供的所有方法，在 JavaScript 的所有物件的可以呼叫

即便建立物件時，沒有定義這些方法，但基於原型鏈的繼承，我們還是可以呼叫這些方法

## 參考

[重新認識 JavaScript: Day 24 物件與原型鏈](https://ithelp.ithome.com.tw/articles/10194154)
[鐵人賽：JavaScript 的原型繼承](https://www.casper.tw/javascript/2017/12/17/javascript-prototype/)
[前端三十｜15. [JS] 什麼是原型鏈？](https://medium.com/schaoss-blog/%E5%89%8D%E7%AB%AF%E4%B8%89%E5%8D%81-15-js-%E4%BB%80%E9%BA%BC%E6%98%AF%E5%8E%9F%E5%9E%8B%E9%8F%88-15543787efb)
[重新認識 JavaScript: Day 25 原型與繼承](https://ithelp.ithome.com.tw/articles/10194356)