原型链
原型链比作用域链要好明白的多。
JavaScript中的每一个对象，都有一个内置的_proto_属性。这个属性是编程不可见的（虽然ES6规范中开放了这个属性，然则浏览器对这个属性的可见性的支撑差别），它实际上是对另一个对象或许null的援用。
当一个对象须要援用一个属性时，JavaScript引擎首先会从这个对象本身的属性表中寻觅这个属性标识，假如找到则举行响应读写操纵，若没有在本身的属性表中找到，则在_proto_属性援用的对象的属性表中查找，云云来去，直到找到这个属性或许_proto_属性指向null为止。
这个_proto_的援用链，被称作原型链。
<!–more–>
注重，此处有一个机能优化的题目：往原型链越深处搜刮，消耗的时候越多。
原型链和组织函数
JavaScript是一种面向对象的言语，而且能够举行原型继续。
JavaScript中的函数有一个属性prototype，这个prototype属性是一个对象，它的一个属性constructor援用该函数本身。即：
func.prototype.constructor === func; // ==> true
这个属性有什么用呢？我们晓得一个，一个函数运用new操纵符挪用时，会作为组织函数返回一个新的对象。这个对象的_proto_属性援用其组织函数的prototype属性。
因而这个就不难明白了：
var obj = new Func();
obj.constructor == Func; // ==> true
另有这个：
obj instanceof Func; // ==> true
也是经由过程查找原型链上的constructor属性完成的。
组织函数天生的差别实例的_proto_属性是对同一个prototype对象的援用。所以修正prototype对象会影响一切的实例。
“子类”继续完成的几种体式格局
之所以子类要加引号，是因为这里说“类”的观点是不严谨的。JavaScript是一门面向对象的言语，然则它跟Java等言语差别，在ES6规范出炉之前，它是没有类的定义的。
然则熟习Java等言语的程序员，也愿望运用JavaScript时，跟运用Java相似，经由过程类天生实例，经由过程子类复用代码。那末在ES6之前，怎样做到像以下代码一样运用相似”类”的体式格局呢？
var parent = new Parent("Sam");
var child = new Children("Samson");
parent.say(); // ==> "Hello, Sam!"
child.say(); // ==> "Hello, Samson! hoo~~"
child instanceof Parent; // ==> true
我们看到，这里我们把组织函数当作类来用。
以下我们讨论一下完成的几种体式格局：
最简朴的体式格局
连系原型链的观点，我们很轻易就可以写出如许的代码：
function Parent(name){
this.name = name;
}
Parent.prototype.say = function(){
console.log("Hello, " + this.name + "!");
}
function Children(name){
this.name = name;
}
Children.prototype = new Parent();
Children.prototype.say = function(){
console.log("Hello, " + this.name + "! hoo~~");
}
这个体式格局瑕玷很明显：作为子类的组织函数须要依靠一个父类的对象。这个对象中的属性name基本毫无用处。
第一次革新
// ...
Children.prototype = Parent.prototype;
// ...
如许就不会发生无用的父类属性了。
然则，如许的话子类和父类的原型就援用了同一个对象，修正子类的prototype也会影响父类的原型。
这时候我们发明：
parent.say(); // ==> "Hello，Sam! hoo~~"
这第一次革新还不如不改。
第二次革新——暂时组织函数/Object.create
function F(){ // empty
}
F.prototype = Parent.prototype;
Children.prototype = new F();
// ...
parent.say(); // ==> "Hello, Sam!"
child.say(); // ==> "Hello, Samson! hoo~~"
如许一来，修正子类的原型只是修正了F的一个实例的属性，并没有转变Parent.prototype，从而处理了上面的题目。
在ES5的时期，我们还能够直接如许：
Children.prototype = Object.create(Parent.prototype);
这里的思绪是一样的，都是让子类的prototype不直接援用父类prototype。如今的当代浏览器险些已添加了对这个要领的支撑。（但我们下面会仍以暂时组织函数为基本）
然则细细思索，这个计划仍有须要优化的处所。比方：怎样让父类的组织函数逻辑直接运用到子类中，而不是再从新写一遍一样的？这个例子中只要一个name属性的初始化，那末假定有许多属性且逻辑一样的话，岂不是没有做到代码重用？
第三次革新——组织函数要领借用
运用apply，完成“要领重用”的头脑。
function Children(name){
Parent.apply(this, arguments);
// do other initial things
}
“圣杯”形式
如今完全的代码以下：
function Parent(name){
this.name = name;
}
Parent.prototype.say = function(){
console.log("Hello, " + this.name + "!");
}
function Children(name){
Parent.apply(this, arguments);
// do other initial things
}
function F(){ // empty
}
F.prototype = Parent.prototype;
Child.prototype = new F();
Children.prototype.say = function(){
console.log("Hello, " + this.name + "! hoo~~");
}
这就是所谓“圣杯”形式，听着很嵬峨上吧？
以上就是ES3的时期，我们用来完成原型继续的一个近似最好实践。
“圣杯”形式的题目
“圣杯”形式依旧存在一个题目：虽然父类和子类实例的继续的prototype对象不是同一个实例，然则这两个prototype对象上面的属性援用了一样的对象。
假定我们有：
Parent.prototype.a = { x: 1};
// ...
那末即使是“圣杯”形式下，依旧会有如许的题目：
parent.x // ==> 1
child.x // ==> 1
child.x = 2;
parent.x // ==>2
题目在于，JavaScript的拷贝不是 深拷贝(deepclone)
要处理这个题目，我们能够应用属性递归遍历，本身完成一个深拷贝的要领。这个要领在这里我就不写了。
ES6来了
ES6极大的支撑了工程化，它的规范让浏览器内部完成类和类的继续：
class Parent {
constructor(name) { //组织函数
this.name = name;
}
say() {
console.log("Hello, " + this.name + "!");
}
}
class Children extends Parent {
constructor(name) { //组织函数
super(name); //挪用父类组织函数
// ...
}
say() {
console.log("Hello, " + this.name + "! hoo~~");
}
}
如今浏览器对其支撑水平还不高。然则这类写法确实省力不少。让我们对将来拭目以待。
