js 總結系列（三）原型鏈

五個基礎點：

1. 全部的函數都有 prototype 屬性，指向該函數的原型對象；
2. 全部的對象都有__proto__屬性，指向該對象的構造函數的的原型對象；
3. 因爲js中萬物皆對象，因此構造函數也有__proto__屬性；
4. 構造函數是經過Function構造函數構造出來的實例，因此構造函數的__proto__屬性皆指向同一個對象，經過2可得，都是指向Function的原型對象；
5. 全部構造函數的原型對象的constructor都指向構造函數自己

構造函數、構造函數實例、構造函數原型對象之間的關係

1. js中的對象是經過構造函數創造出來的，構造函數的prototype指針指向了一個對象，咱們能夠叫它構造函數的原型對象，經過構造函數創造出來的實例上也有一個指針指向構造函數的原型對象。這樣構造函數建立的實例就跟構造函數的原型對象就關聯起來了。
2. 構造函數原型對象的constructor指針指向構造函數，構造函數的prototype指針指向其原型對象。

instanceof 操做符

與typeof操做符相似，instanceof是用來判斷對象類型的，使用該操做符的表達式返回值是布爾值，true表示第一個操做數是第二個操做數的實例，而且具備繼承關係的對象也能夠返回true。

function A() {};
function B() {};
let a = new A();
a instanceof A // true
a instanceof B // false
a instanceof Object // true

上面例子中說明了對象a是構造函數A的實例，同時也是構造函數Object的實例，可是不是構造函數B的實例。咱們思考一下：爲何會有這種結果？咱們能夠根據構造函數、構造函數實例、構造函數原型對象之間的關係來了解。
a 與 A之間的關聯關係是由於兩者都有一個指針指向同一個對象（構造函數原型對象），那麼咱們能夠驗證一下instanceof操做符是否與此有關。

a.__proto__ = B.prototype
a instanceof A // false
a instanceof B // true
a instanceof Object // true

經過以上示例能夠得出instanceof操做符的結果確實反應的是實例對象跟原型對象之間的關係。爲何
a也是Object的實例呢？經過上面的分析能夠得出a與Object的原型對象存在某種聯繫。

function C() {};
let objC = new C();

上面示例中，function C是一個函數，函數也是一個對象。在js中函數是經過Function構造函數建立的，也就是說C.__proto__ === Function.prototype。一樣來講，Function.prototype這個對象的__proto__也有一個相關的構造函數，咱們看看這個對象的構造函數是什麼。

Function.prototype.__proto__.constructor // [Function: Object]

也就是說Function.prototype對象是Object構造函數建立的。

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

說明了Function的原型對象的__proto__指針指向了Object的原型對象。
咱們再來整理一遍上面的問題。

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

咱們能夠發現objC與Object.portotype之間經過__proto__實現了關聯，也就是說這種關聯關係能夠經過instanceof操做符來判斷是否存在。這種關聯關係就是原型鏈。
再看一組示例：

Function instanceof Function // true
Function instanceof Object // true
Object instanceof Function // true
Object instanceof Object // true

經過前面的探討咱們能夠解釋上面問題：

1. Function是構造函數，因此既有prototype指針，又有__proto__指針。因爲Function instanceof Function結果爲true，因此說明Function.__proto__ 與 Function.prototype存在原型鏈關係。咱們進一步做出判斷Function.__proto__ === Function.prototype // true，因此說明Function的__proto__跟Function的prototype指向同一個對象。
2. Function instanceof Object爲true說明Function.__proto__與Object.prototype存在原型鏈關係，咱們進一步做出判斷Function.__proto__.__proto__ === Object.prototype // true，說明Funciton的原型對象的__proto__指針指向了Object的原型對象。
3. Object instanceof Function爲true說明Object.__proto__與Function.prototype存在原型關係，進一步判斷Object.__proto__ === Function.prototype // true說明Object構造函數是Function的實例對象。
4. Object.__proto__與Function.prototype指向相同，因爲Function.prototype與Object.prototype存在原型鏈關係，因此Object instanceof Object的結果爲true。

經過以上的分析咱們能夠經過一張圖來講明js中各對象間原型鏈關係