出處:https://www.cnblogs.com/liujingjiu/p/14371624.html

原型前言繼承是面向物件程式設計中相當重要的一個概念，它對幫助程式碼複用起到了很大的作用。正文

Brendan Eich 在建立JavaScript時，沒有選擇當時最流行的類繼承機制，而是借鑑 Self ，用到了 基於原型（prototype）的繼承機制 ，這導致了JavaScript在繼承機制方面與Java、C++等基於類繼承機制的語言有著顯著的區別。

其具體在於— C++的多重繼承、Java的繼承和介面實現中都包含" 類 "的概念，它們傾向於在建立物件之前已經規定了物件需要繼承的類和實現的介面,並且使用類與類之間的繼承方式 。

而在JavaScript中沒有"類 "的概念，在物件之後所繼承的物件也是可以發生動態變化的，並且使用的是物件與物件之間的繼承方式 。

如果將JavaScript中 由string，number，bigint，boolean，null，undefined，symbol組成的基礎型別與其對應的值 都按下不表，餘下的 引用型別與其對應的值 將都存在著__proto__屬性，指向繼承的原型物件。

與__proto__存在於每個物件中不同，prototype屬性只存在於函式中，在預設的的情況下所有物件的__proto__屬性的值與其建構函式下的prototype屬性的值是一致的。

let obj = new Object();obj.constructor === Object;//true//obj的__proto__屬性的值與obj的建構函式的prototype屬性的值指向同一塊堆記憶體obj.__proto__ === obj.constructor.prototype;//trueobj.__proto__ === Object.prototype;//true

所有函式的建構函式都指向Function：

Object.constructor === Function;//true//Object的__proto__屬性的值與Object的建構函式的prototype屬性的值指向同一塊堆記憶體Object.__proto__ === Object.constructor.prototype;//trueObject.__proto__ === Function.prototype;//trueFunction.constructor === Function;//true//Function的__proto__屬性的值與Function的建構函式的prototype屬性的值指向同一塊堆記憶體Function.__proto__ === Function.constructor.prototype;//trueFunction.__proto__ === Function.prototype;//true

Function的prototype屬性的原型指向Object.prototype：

Object.prototype === Function.prototype.__proto__;//true

不單單是 Function 的prototype屬性的原型指向 Object.prototype ，幾乎所有的函式的prototype屬性的原型指向 Object.prototype ，從 V8的測試程式碼 中可見一斑：

最後，位於原型頂點的是Object.prototype.__proto__，它指向 null：

Object.prototype.__proto__ === null;//trueObject.prototype.constructor === Object;//true

根據以上邏輯畫的原型指向圖：

為了加深理解，我將再定義一個建構函式：

function Person(){	}Person.constructor === Function;//truePerson.__proto__ === Person.constructor.prototype;//truePerson.__proto__ === Function.prototype;//true

透過新定義的建構函式建立物件：

let person = new Person();person.constructor === Person;//trueperson.__proto__ === person.constructor.prototype;//trueperson.__proto__ === Person.prototype;//true

根據以上邏輯畫的最終的原型指向圖：

結尾

瞭解JavaScript中基於原型（prototype）的繼承機制的重點在於捋清楚Object與Function的__proto__、constructor、prototype屬性的指向關係，再進一步瞭解Object和Function各自對應的值以及透過Function對應的值創建出來的物件的__proto__、constructor、prototype屬性的指向關係，就大功告成了。

聽起來可能有一點點繞，最好是動手畫一下圖，以後忘記的時候看一下自己畫的圖就又想起來了。

出處:https://www.cnblogs.com/liujingjiu/p/14371624.html