JavaScript中多种组合继承的介绍（代码示例）

来源：动视网责编：小采时间：2020-11-27 19:27:52

JavaScript中多种组合继承的介绍（代码示例）

JavaScript中多种组合继承的介绍（代码示例）:本篇文章给大家带来的内容是关于JavaScript中多种组合继承的介绍（代码示例），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。1. 组合继承：又叫伪经典继承，是指将原型链和借用构造函数技术组合在一块的一种继承方式。下面来看一个例子：

推荐度：

点击下载本文 文档为doc格式

导读JavaScript中多种组合继承的介绍（代码示例）:本篇文章给大家带来的内容是关于JavaScript中多种组合继承的介绍（代码示例），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。1. 组合继承：又叫伪经典继承，是指将原型链和借用构造函数技术组合在一块的一种继承方式。下面来看一个例子：

本篇文章给大家带来的内容是关于JavaScript中多种组合继承的介绍（代码示例），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。

1. 组合继承：又叫伪经典继承，是指将原型链和借用构造函数技术组合在一块的一种继承方式。

下面来看一个例子：

function SuperType(name) {
 this.name = name;
 this.colors = ["red", "blue", "green"];
 }
 SuperType.prototype.sayName = function() {
 alert(this.name);
 }
 function SubType(name, age) {
 SuperType.call(this, name);
 this.age = age;
 }
 
 //继承方法
 SubType.prototype = new SuperType();
 SubType.prototype.sayAge = function() {
 alert(this.age);
 }
 
 var instance1 = new SubType("Nicholas", 29);
 instance1.colors.push("black");
 alert(instance1.colors); //red,blue,green,black
 instance1.sayName(); //Nicholas
 instance1.sayAge(); //29
 
 var instance2 = new SubType("Greg", 27);
 alert(instance2.colors); //red,blue,green
 instance2.sayName(); //Greg
 instance2.sayAge(); //27

组合继承避免了原型链和借用构造函数的缺陷，融合它们的优点。

2. 原型式继承

可以在不必预先定义构造函数的情况下实现继承，其本质是执行对给定对象的浅复制。而复制得到的副本还可以得到进一步的改造。

function object(o) {
 function F(){};
 F.prototype = o;
 return new F;
 }
 
 var person = {
 name: "Nicholas",
 friends: ["Shelby", "Court", "Van"]
 };
 
 var antherPerson = object(person);
 antherPerson.name = "Greg";
 antherPerson.friends.push("Rob");
 
 var antherPerson = object(person);
 antherPerson.name = "Linda";
 antherPerson.friends.push("Barbie");
 
 alert(person.friends); //Shelby,Court,Van,Rob,Barbie

3. 寄生式继承

与原型式继承非常相似，也是基于某个对象或某些信息创建一个对象，然后增强对象，最后返回对象。为了解决组合继承模式由于多次调用超类型构造函数而导致的低效率问题，可以将这个模式与组合继承一起使用。

function object(o) {
 function F(){};
 F.prototype = o;
 return new F;
 }
 function createAnother(original) {
 var clone = object(original);
 clone.sayHi = function() {
 alert("Hi");
 };
 return clone;
 }
 
 var person = {
 name: "Nicholas",
 friends: ["Shelby", "Court", "Van"]
 };
 
 var anotherPerson = createAnother(person);
 anotherPerson.sayHi();

4. 寄生组合式继承

集寄生式继承和组合继承的优点与一身，是实现基本类型继承的最有效方式。

//继承原型
 function extend(subType, superType) {
 function F(){};
 F.prototype = superType.prototype;
 
 var prototype = new F;
 prototype.constructor = subType;
 subType.prototype = prototype;
 }
 
 //超类方法
 function SuperType(name) {
 this.name = name;
 this.colors = ["red", "blue", "green"];
 }
 SuperType.prototype.sayName = function() {
 return this.name;
 }
 
 //子类方法
 function SubType(name, age) {
 SuperType.call(this, name);
 this.age = age;
 }
 
 //继承超类的原型
 extend(SubType, SuperType);
 
 //子类方法
 SubType.prototype.sayAge = function() {
 return this.age;
 }
 
 var instance1 = new SubType("Shelby");
 var instance2 = new SubType("Court", 28);
 
 instance1.colors.push('black');
 
 alert(instance1.colors); //red,blue,green,black
 alert(instance2.colors); //red,blue,green
 
 alert(instance1 instanceof SubType); //true
 alert(instance1 instanceof SuperType); //true

这段例子的高效率体现在它只调用了一次SuperType构造函数，并且因此避免了在SubType.prototype上面创建不必要的多余的属性。与此同时，原型链还能保持不变。因此，还能正常使用instanceof 和 isPrototypeOf()。开发人员普遍认为寄生组合式继承是引用类型最理想的继承范式。

JavaScript中多种组合继承的介绍（代码示例）

推荐度：

点击下载本文 文档为doc格式

标签： javascript 代码实例示例代码介绍

热门焦点

JavaScript中多种组合继承的介绍（代码示例）

JavaScript中多种组合继承的介绍（代码示例）

JavaScript中多种组合继承的介绍（代码示例）

最新推荐

猜你喜欢

热门推荐