javascript实现继承的6种方式

/*1、原型链继承*/
function SuperType() {
    this.property = true;
}
SuperType.prototype.getSuperValue = function() {
    return this.property;
};
function subType() {
    this.subProperty = false;
}
//继承了SuperType
Subtype.prototype = new SuperType();
SubType.prototype.getSubValue = function() {
    return this.subProperty;
};

var instance = new subType();
alert(instance.getSuperValue());   //true
/*
 问题:包含引用类型值的原型属性会被所有实例属性共享。
       原型链实现继承时,原型实际上是另一个类型的实例,
       所以原先的实例属性变成了现在的原型属性。
*/
/*2、借用构造函数*/
function SuperType() {
    this.colors = {"red", "blue", "green"};
}
function SubType() {
    SuperType.call(this);   //调用SuperType构造函数对SubType对象初始化,每个SubType实例都有SuperType所有属性和方法
}

var instance1 = new SubType();
instance1.colors.push("black");
alert(instance1.colors);   //"red,blue,green,black"
var instance2 = new SubType();
alert(instance2.colors);   //"red,blue,green"
/*
 问题:方法都在构造函数中定义,无复用性;超类型在原型中定义的方法对子类型不可见
*/
/*3、组合继承(原型链+借用构造函数)*/
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.constructor = Subtype;
Subtype.prototype.sayAge = function() {
    alert(this.age);
}

var instance1 = new SubType("zcj",21);
instance1.colors.push("black");   //"red,blue,green,black"
instance1.sayName();   //"zcj"
instance1.sayAge();   //21

var instance2 = new SubType("Garg",27);
alert(instance2.colors);   //"red,blue,green"
instance1.sayName();   //"Garg"
instance1.sayAge();   //27
/*
 说明:避免了原型链和借用构造函数的缺陷,融合了其优点,最常用的继承模式
*/
/*4、原型式继承*/
var person = {
    name:"Nicholas",
    friends:["Shelby","Court","Van"]
};

var anotherPerson = Object.creat("person");
anotherPerson.name = "Greg";
anotherPerson.friends.push("Rob");

var yetAnotherPerson = Object.creat("person");
anotherPerson.name = "Linda";
anotherPerson.friends.push("Barbie");

alert(person.friends);   //"Shelby,Court,Van,Rob,Barbie"
/*
 说明:利用Object.create()方法,将一个对象赋给新对象的原型并返回新对象,包含引用类型值的属性会共享相应的值(如原型模式一样)
*/
/*5、寄生式继承*/
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();   //"hi"
/*思路与工厂模式和寄生构造函数类似,能够返回新对象的函数(如object())接收一个对象作为参数.使用此方法由于不能做到函数的复用性而是效率降低(与构造函数模式类似)
*/
/*6、寄生组合式继承*/
function inheritPrototype(subtype,supertype) {
    var prototype = supertype.prototype;   //创建对象
    prototype.constructor = subtype;   //增强对象
    subtype.prototype = prototype;   //指定对象
}
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;
}
inheritPrototype(SubType,SuperType);   /*继承原型函数,得到超类型副本*/
SubType.prototype.sayAge = function() {
    alert(this.age);
}
var instance = new SubType("zcj", 21);   /*只在这里调用了SuperType构造函数,在新对象上创建name和colors属性*/

/*
 说明:相对于组合式继承效率更高。只调用了一次SuperType构造函数,避免了在subType.prototype上创建不必要的属性
*/
原文地址:https://www.cnblogs.com/Merc47/p/4784018.html