JavaScript 继承的五种实现方式详解

下面介绍几种常用的 JavaScript 继承实现方式：

对象冒充实现继承

原理：构造函数利用 this 关键字为所有属性和方法赋值。由于构造函数本质上只是函数，因此可以将 ClassA 的构造函数作为 ClassB 的方法进行调用，从而让 ClassB 获得 ClassA 构造函数中定义的属性和方法。示例如下：

function classA(name)
{ 
this.name=name;
this.showName=function(){alert(this.name);}
} 
function classB(name)
{ 
this.newMethod = classA;
this.newMethod(name);
} 
obj = new classA("hero");
objB = new classB("dby");
obj.showName(); // print hero
objB.showName(); // print dby 说明classB 继承了classA的方法.

对象冒充技术还可以实现多重继承，例如：

function classz(){
this.newMethod = classX;
this.newMethod();
delete this.newMethod;
this.newMethod=classY;
this.newMethod():
delete this.newMethod;
} 

但是如果classX和classY有相同的属性或者方法,classY具有高优先级.

使用 call 方法实现继承

call 方法是一种与经典对象冒充法相近的技术，它的第一个参数用作 this 的对象，其他参数都直接传递给函数自身。

function sayName(perfix)
{ 
alert(perfix+this.name);
} 
obj= new Object();
obj.name="hero";
sayName.call(obj,"hello," );
function classA(name)
{ 
this.name=name;
this.showName=function(){alert(this.name);};
} 
function classB(name)
{ 
classA.call(this,name);
} 
objB = new classB("bing");
objB.showName();////说明classB继承classA的showName方法

使用 apply 方法实现继承

aplly() 方法有两个参数，一个用作 this 对象，另一个是传递给函数的参数数组。

function sayName(perfix)
{ 
alert(perfix+this.name);
} 
obj= new Object();
obj.name="hero";
sayName.aplly(obj,new Array("hello,") );

原型链继承

prototype 对象的任何属性和方法都会被传递给对应类的所有实例，原型链就是通过这种方式来实现继承的。

function classA (){}
classA.prototype.name="hero";
classA.prototype.showName=function(){alert(this.name)}
function classB(){
classB.prototype=new classA();
objb = new classB()
objb.showName();//print hero 说明b继承了a的方法

这里需要注意 调用classA的构造函数时,没有给它传递参数,这是原型链的标准做法,确保函数的构造函数没有任何参数.

并且 子类的所有属性和方法,必须出现在prototype属性被赋值后,应为在它之前赋的值会被删除.因为对象的prototype属性被替换成了新对象,添加了新方法的原始对象将被销毁.

混合继承模式

就是用冒充方式 定义构造函数属性,用原型法定义对象方法.

function classA(name)
{ 
this.name=name;
} 
classA.prototype.showName=function(){alert(this.name)}
function classB(name)
{ 
classA.call(this,name);
} 
classB.prototype = new classA();
classB.prototype.showName1=function(){alert(this.name+"*****");};
obj = new classB("hero");
obj.showName();
obj.showName1();

在classB的构造函数中通过调用call方法 继承classA中的name属性,用原型链来继承classA的showName方法.