先看一個(gè)簡(jiǎn)短的例子：

function Foo(){}
Foo.prototype = {}
var obj = new Foo()
obj.constructor === Foo//false
obj.constructor === Object//true

分析：?jiǎn)栴}——為什么不是Undefined？我們知道對(duì)于構(gòu)造函數(shù)new出來(lái)的對(duì)象來(lái)說(shuō)，他的[[Prototype]]是指向構(gòu)造函數(shù)的prototype對(duì)象的。當(dāng)在一個(gè)實(shí)例化出來(lái)的對(duì)象中利用.操作符找不到某個(gè)屬性的時(shí)候，JavaScript引擎就會(huì)順著對(duì)象的原型鏈往上找，對(duì)于這里的例子，也就是找到了Foo.prototype對(duì)象上，很遺憾由于Foo.prototype被重寫(xiě)，所以此時(shí)仍舊找不到constructor屬性，所以一開(kāi)始我覺(jué)得的答案是Undefined。然而還是想簡(jiǎn)單了，對(duì)于對(duì)象的委托機(jī)制來(lái)說(shuō)，JavaScript引擎在查找屬性名的時(shí)候是不會(huì)輕易的就地放棄的，他會(huì)繼續(xù)打破砂鍋問(wèn)到底，既然Foo.prototype對(duì)象沒(méi)有的話，那么便繼續(xù)沿著到Foo.prototype對(duì)象上的[[Prototype]]找，直到找到了Object.prototype為止，所以對(duì)于這里的這個(gè)例子來(lái)說(shuō)，JavaScript引擎就是找到了Object.prototype上，此時(shí)就找到了Object.prototype對(duì)象上的constructor屬性，其值指向Object函數(shù)，所以為Object。

需要指出的是，函數(shù)prototype對(duì)象上的constructor屬性的值是可修改的，但是默認(rèn)是不可被遍歷，所以說(shuō)當(dāng)你修改prototype對(duì)象上的constructor屬性的時(shí)候，最好將其訪問(wèn)器屬性總enumerable的值改為false。

需要注意的是：利用for...in...獲取對(duì)象的鍵名時(shí)，原型鏈上的可被遍歷屬性也會(huì)被涉及。要獲取一個(gè)對(duì)象上屬于自己的屬性的話，應(yīng)該使用這兩個(gè)方法更合適：Object.keys(targetObj)和Object.getOwnPropertyNames(targetObj)，其中前者返回對(duì)象自身的可遍歷的所有屬性，后者返回屬于對(duì)象自身的所有屬性，包括可遍歷屬性。

function Foo(){}
Foo.prototype.a = 1
Foo.prototype.b = 2
var obj = new Foo()
Object.defineProperty(obj, "c", {
  "value": 3,
  "writable": false,
  "configurable": false,
  "enumerable": false
})
for(var key in obj){
  console.log(key)//a b
}
console.log(Object.keys(obj))//[]
console.log(Object.getOwnPropertyNames(obj))//["c"]

1.原型繼承或稱(chēng)之為原型委托
在ES5中，如果你想實(shí)現(xiàn)其他語(yǔ)言中的那種繼承效果的話，那么使用原型委托可以做到這一點(diǎn)。利用原型委托實(shí)現(xiàn)繼承的思想是：構(gòu)造函數(shù)實(shí)例化出來(lái)的對(duì)象的[[Prototype]]屬性會(huì)指向構(gòu)造函數(shù)的prototype對(duì)象，而如果我讓由A構(gòu)造函數(shù)實(shí)例化出來(lái)的A對(duì)象的[[Prototype]]屬性指向B構(gòu)造函數(shù)的prototype的話，那么A對(duì)象就能夠訪問(wèn)的到B構(gòu)造函數(shù)prototype對(duì)象中的屬性，正是實(shí)現(xiàn)了這樣一種復(fù)用效果，使得繼承可被實(shí)現(xiàn)。那么問(wèn)題來(lái)了，怎么讓A對(duì)象的[[prototype]]指向B構(gòu)造函數(shù)的prototype呢？我們知道A對(duì)象的[[Prototype]]是指向A.prototype，而要達(dá)到我們希望的效果的話：可以有下面幾種方法

• 利用Object.create(source)：（淺拷貝）這個(gè)方法將會(huì)返回一個(gè)新對(duì)象，這個(gè)返回的新對(duì)象的[[Prototype]]將會(huì)指向source，所以source能訪問(wèn)的到的，新對(duì)象都能夠訪問(wèn)到，這意味著一個(gè)龐大的原型鏈。在這里即A.prototype = Object.create(B.prototype)，這種方法是最為推薦的，副作用最小。需要注意的地方，通過(guò)這種方法實(shí)現(xiàn)的時(shí)候，我們希望被復(fù)用的功能并不是掛載在構(gòu)造函數(shù)的prototype對(duì)象上，而是掛載在構(gòu)造函數(shù)的prototype對(duì)象上的[[Prototype]]中。對(duì)應(yīng)這里的這個(gè)例子就是并非掛載在Foo.prototype上，而是Foo.prototype對(duì)象的[[Prototype]]對(duì)象中。由此帶來(lái)的是一系列關(guān)系復(fù)雜，縱橫交錯(cuò)的原型鏈，看了簡(jiǎn)直讓人束手無(wú)策。下面看一下這個(gè)例子：

function Fun(str){this.name = str}
var obj = {
    "a": 1,
    "test": function(){console.log("success\t" + this.a)}
}
Fun.prototype = Object.create(obj)
Fun.prototype.sayName = function(){console.log(this.name)}
function Foo(str, age){
   Fun.call(this, str)
   this.age = age
   this.a = 666
}
Foo.prototype = Object.create(Fun.prototype)
Foo.prototype.sayAge = function(){console.log(this.age)}
var person = new Foo("hahahai", 21)
person.sayName()//繼承而來(lái)的 "hahahai"
person.sayAge()//21
console.log(Foo.prototype.hasOwnProperty("sayName"))//false
var _pro = Object.getPrototypeOf(Foo.prototype)
console.log(_pro.hasOwnProperty("sayName"))//true
person.test()//success 666

這里我們解析一下，為什么person.test()不是TypeError而是能夠被成功訪問(wèn)。首先對(duì)于JavaScript引擎來(lái)說(shuō)，他大概是這樣尋找test的：1.person對(duì)象自身里尋找；2.無(wú)果，person的[[Prototype]]即Foo.prototype上尋找，在它它上面只有sayAge這一個(gè)屬性；3.無(wú)果，到Foo.prototype對(duì)象的[[Prototype]]上尋找，它指向Fun.prototype，所以即是到Fun.prototype對(duì)象自身上尋找，它上面只有sayName這一個(gè)屬性；4.無(wú)果，所以到Fun.prototype對(duì)象的[[Prototype]]上尋找，它指向obj對(duì)象上，所以即到obj對(duì)象上進(jìn)行查找，此時(shí)成功查找到。
解析二：通過(guò)重重難關(guān)最終成功訪問(wèn)到了test()函數(shù)之后，為什么輸出的卻是666，這就和我們之前討論的關(guān)于this的訪問(wèn)機(jī)制有關(guān)了，由于test函數(shù)作為對(duì)象方法被調(diào)用，所以test方法中的this環(huán)境對(duì)象既是person對(duì)象。拓展：有的時(shí)候是這樣的形式的話：obja.objb.fun()，那么此時(shí)fun函數(shù)內(nèi)部this的環(huán)境對(duì)象又是誰(shuí)呢？答案就是objb。

• 簡(jiǎn)單的淺拷貝：A.prototype = B.prototype，這種方式的缺點(diǎn)很明顯，那就是這里是直接讓A.prototype和B.prototye指向同一塊內(nèi)存，即淺拷貝。盡管利用target = Object.create(source)也是一種淺拷貝，但是這里的淺拷貝是target的[[Prototype]]和source之間的淺拷貝，所以對(duì)target動(dòng)態(tài)添加屬性是不會(huì)影響source的。但是對(duì)于A.prototype = B.prototype那可就不一樣了，如果你對(duì)對(duì)象A動(dòng)態(tài)增加屬性的話，那么也會(huì)影響B(tài)對(duì)象。

function Foo(str){this.name = str}
Foo.prototype.sayName = function(){console.log(this.name)}
function Fun(str, age){
    Foo.call(this, str)
    this.age = age
}
Fun.prototype = Foo.prototype
Fun.prototype.sayAge = function(){console.log(this.age)}
var person = new Fun("hahahai", 21)
var person2 = new Foo("AHH")
person.sayName()//"hahahai"
person.sayAge()//21
person2.sayName()//"AHH"
person2.sayAge()//undefined

• A.prototype = new B()：缺點(diǎn)就是副作用太明顯了，因?yàn)槲覀冋{(diào)用了B構(gòu)造函數(shù)去實(shí)例化一個(gè)對(duì)象出來(lái)，而這個(gè)對(duì)象有很多東西顯然是沒(méi)有必要被繼承的。下面可以看一個(gè)例子：

function Foo(str){this.name = str}
Foo.prototype.sayName = function(){console.log(this.name)}
function Fun(str, age){
    Foo.call(this, str)
    this.age = age
}
Fun.prototype = new Foo("lili")
Fun.prototype.sayAge = function(){console.log(this.age)}
var person = new Fun("hahahai", 21)
person.sayName()//”hahahai"
person.sayAge()//21
console.log(Fun.prototype.name)//"lili"

• 利用ES6推出的Object.setPrototypeOf(targetPrototype, sourcePrototype)，下面可以看一個(gè)例子：

function Fun(name){this.name = name}
Fun.prototype.sayName = function(){console.log(this.name)}
function Foo(name, age){
    this.name = name
    this.age = age
}
Object.setPrototypeOf(Foo.prototype, Fun.prototype)
console.log(Foo.prototype === Fun.prototype)//false
console.log(Foo.prototype == Fun.prototype)//false
console.log(Object.getOwnPropertyNames(Foo.prototype))//["constructor"]
console.log(Object.getOwnPropertyNames(Fun.prototype))//["constructor", "sayName"]
console.log(Object.getOwnPropertyNames(Object.getPrototypeOf(Foo.prototype)))//["constructor", "sayName"]
var person = new Foo("hahahai", 21)
person.sayName()

通過(guò)上面的那個(gè)例子我們也可以發(fā)現(xiàn)Object.setPrototypeOf(target, source)和target = Object.create(source)是類(lèi)似的，都是利用target.prototype對(duì)象的[[Prototype]]引用source.prototype。既然新標(biāo)準(zhǔn)有個(gè)專(zhuān)門(mén)的函數(shù)來(lái)實(shí)現(xiàn)原型的委托的話，那么我推薦使用Object.setPrototypeOf(targetPrototype, sourcePrototype)。

END