一、prototype

JS中每個函數(shù)都有一個prototype屬性，該屬性指向函數(shù)的原型對象

function Person(age) {
    this.age = age       
}
Person.prototype.name = 'Julian'
var person1 = new Person()
var person2 = new Person()
console.log(person1.name) //Julian
console.log(person2.name)  //Julian

解析：
（1）函數(shù)的prototype指向了一個對象，這個對象就是調(diào)用構(gòu)造函數(shù)時創(chuàng)建的實(shí)例的原型，即person1、person2的原型
（2）每一個JS對象（除null外）創(chuàng)建的時候，就會與之關(guān)聯(lián)另一個對象，這個對象就是原型，每一個對象都會從原型中“繼承”屬性
（3）構(gòu)造函數(shù)和實(shí)例原型之間的關(guān)系

構(gòu)造函數(shù)和實(shí)例原型之間的關(guān)系.png

二、proto

每個對象（除null外）都會有的屬性，叫做proto，這個屬性會指向該對象的原型

function Person() {

}
var person = new Person();
console.log(person.__proto__ === Person.prototype);     // true

解析：絕大部分瀏覽器都支持這個非標(biāo)準(zhǔn)的方法訪問原型，然而它并不存在于 Person.prototype 中，實(shí)際上，它是來自于 Object.prototype ，與其說是一個屬性，不如說是一個 getter/setter，當(dāng)使用 obj.proto 時，可以理解成返回了 Object.getPrototypeOf(obj)。

實(shí)例原型關(guān)系圖.png

三、constructor

每個原型都有一個constructor屬性，指向該關(guān)聯(lián)的構(gòu)造函數(shù)

function Person() {

}
console.log(Person === Person.prototype.constructor);    //true

實(shí)例對象原型的constructor屬性與構(gòu)造函數(shù)實(shí)例之間的關(guān)系圖.png

function Person() {

}

var person = new Person();
console.log(person.__proto__ == Person.prototype)     // true
console.log(Person.prototype.constructor == Person)     // true
// ES5的方法,可以獲得對象的原型
console.log(Object.getPrototypeOf(person) === Person.prototype) // true

補(bǔ)充說明：

function Person() {

}
var person = new Person();
console.log(person.constructor === Person);     // true

解析：當(dāng)獲取 person.constructor 時，其實(shí) person 中并沒有 constructor 屬性,當(dāng)不能讀取到constructor 屬性時，會從 person 的原型也就是 Person.prototype 中讀取，正好原型中有該屬性，所以：

person.constructor === Person.prototype.constructor

四、實(shí)例與原型

當(dāng)讀取實(shí)例的屬性時，如果找不到，就會查找與對象關(guān)聯(lián)的原型中的屬性，如果還查不到，就去找原型的原型，一直找到最頂層為止。

function Person() {

}
Person.prototype.name = 'Julian';
var person = new Person();

person.name = 'Julian-one';
console.log(person.name)     // Julian-one

delete person.name;
console.log(person.name)      // Julian

解析：給實(shí)例對象 person 添加了 name 屬性，當(dāng)打印 person.name 的時候，結(jié)果自然為 Julian。但是當(dāng)我們刪除了 person 的 name 屬性時，讀取 person.name，從 person 對象中找不到 name 屬性就會從 person 的原型也就是 person.proto ，也就是 Person.prototype中查找，幸運(yùn)的是找到了 name 屬性，結(jié)果為 Julian。但是萬一還沒有找到呢？原型的原型又是什么呢？

五、原型的原型

原型也是一個對象，既然是對象，我們就可以用最原始的方式創(chuàng)建它，那就是：

var obj = new Object();
obj.name = 'Julian'
console.log(obj.name)     // Julian

解析：其實(shí)原型對象就是通過 Object 構(gòu)造函數(shù)生成的，實(shí)例的 proto 指向構(gòu)造函數(shù)的 prototype ，所以關(guān)系圖如下：

原型的原型關(guān)系圖.png

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

解析：null表示沒有對象，所以 Object.prototype.proto 的值為 null 跟 Object.prototype 沒有原型，其實(shí)表達(dá)了一個意思，查找屬性的時候查到 Object.prototype 就可以停止查找了。

完整關(guān)系圖.png

六、原型鏈

每個構(gòu)造函數(shù)都有一個原型對象，原型對象都包含一個指向構(gòu)造函數(shù)的指針（constructor），而實(shí)例都包含一個指向原型對象的內(nèi)部指針（proto）。那么假如我們讓原型對象等于另一個類型的實(shí)例，結(jié)果會怎樣？顯然，此時的原型對象將包含一個指向另一個原型的指針，相應(yīng)地，另一個原型中也包含著一個指向另一個構(gòu)造函數(shù)的指針。假如另一個原型又是另一個類型的實(shí)例，那么上述關(guān)系依然成立。如此層層遞進(jìn)，就構(gòu)成了實(shí)例與原型的鏈條，這就是所謂的原型鏈的基本概念。