圖解JavaScript原型鏈繼承

結合閱讀：

JS原型與原型鏈終極詳解

對象的內部原型(__proto__)和構造器的原型（prototype）

JavaScript中的原型和繼承（譯文）

 

js原型鏈繼承的是_proto_，而不是prototype。

構造器的實例對象的_proto_指向構造器的原型prototype。

全部構造器都來自Function.prototype，甚至包括根構造器Object及Function自身。

全部構造器/函數（Function、Object、Array、Number、Boolean、String、RegExp、Error、Date..）的_proto_都指向Function.prototype。

全部構造器都繼承了Function.prototype的屬性及方法（length、call、apply、bind..）。

全部構造器都是普通js對象，能夠給構造器添加/刪除屬性等，同時也繼承了Object.prototype上的全部方法（toString、valueOf、hasOwnProperty..）。

每一個對象都有一個預約義的constructor屬性，用來引用它的函數對象/構造器。constructor始終指向建立自身的構造函數。

 

補充：Function.prototype的_proto_指向Object.prototype。

數字1表示：帶有Person的this屬性；

數字2表示：帶有Person的prototype屬性；

數字3表示：帶有Object的toString、valueOf、hasOwnProperty..屬性及方法；

數字4表示：帶有Person的靜態屬性；

數字5表示：帶有Function的length、call、apply、bind..屬性及方法。

var Person = function (name) {
   this.name = name;
};
Person.prototype.getName = function () {
   return this.name; 
};
Person.age = 23;
Person.getAge = function () {};var p = new Person();//重寫原型Person.prototype = {　　getName: function () {};}//重寫原型後，會致使：Person.prototype = new Object();   //constructor指向Objectp.constructor === Object;   //truePerson.prototype === Object;   //truep.constructor.prototype.constructor === Object;   //true//修正constructor指向Person.prototype.constructor = Person;