一次性搞懂js中的原型與原型鏈

構造函數：function Foo ( ) { };

實例對象：let f1=new Foo;

1. 談到繼承時，JavaScript 只有一種結構：對象
2. 每一個函數都有 prototype 屬性，除了 Function.prototype.bind()，該屬性指向原型。

prototype

每個JavaScript對象(null除外)在建立的時候就會與之關聯另外一個對象，這個對象就是咱們所說的原型，每個對象都會從原型"繼承"屬性。

函數的 prototype 屬性指向了一個對象，這個對象正是調用該構造函數而建立的實例的原型，也就是這個例子中的 f1 的原型。prototype帶有__proto__和constructor

proto

每個JavaScript對象(除了 null )都具備的一個屬性，叫 __proto__，這個屬性會指向了 建立該對象的構造函數的原型。

console.log(f1._proto_ === Foo.prototype) // true

constructor

每一個原型都有一個 constructor 屬性指向關聯的構造函數

因爲實例對象能夠繼承原型對象的屬性，因此實例對象也擁有constructor屬性，一樣指向原型對象對應的構造函數。

console.log(Foo.prototype.constructor === Foo);//true
console.log(f1.constructor === Foo);//true
console.log(f1.hasOwnProperty('constructor'));//false

原型鏈

JS在建立對象（不管是普通對象仍是函數對象）的時候，都有一個叫作__proto__的內置屬性，用於指向建立它的函數對象的原型對象prototype。以上面的例子爲例：

console.log(fo.__proto__  === Foo.prototype)  //true

一樣Foo.prototype也有proto屬性

console.log(Foo.prototype.__proto__ === Object.prototype)  //true

Object.prototype對象也有proto屬性，但它比較特殊，爲null

console.log(Object.prototype.__proto__ === null)

咱們把這個有proto串起來的直到Object.prototype.proto爲null的鏈叫作原型鏈。原型鏈的造成是真正是靠proto 而非prototype

總結

• 每一個構造函數都有一個原型對象

  Foo.prototype

• 原型對象都包含一個指向構造函數的指針

  Foo.prototype.constructor === Foo

• 實例都包含一個指向原型對象的內部指針

  fo.__proto__  === Foo.prototype

更多文章請前往語雀