JS对象继承(6种)

1. 原型链(父类的实例)
2. 借用构造函数(调用超类构造函数)
3. 组合继承(原型链和借用构造函数)
4. 原型式继承(借助原型基于已有的对象上创建新对象)
5. 寄生式继承(创建一个仅用于封装继承过程的函数)
6. 寄生组合式继承(解决父类属性重写)

ECMAScript无法实现接口继承，只支持实现继承，而且其实现继承主要依靠原型链来实现的

原型链

思想：利用原型让一个引用类型继承另一个引用类型的属性和方法。

function A() {
    this.name = 'A';
}
A.prototype = {
    sayName: function() {
        return this.name;
    }
};
function B() {
    this.name = 'B';
}
//通过原型链继承对象A
B.prototype = new A();
var b = new B();
debug(b.sayName());        //'B'

 

1、 别忘记默认的原型(所有引用类型默认都继承Object,且通过原型链继承)

2、 确定原型和实例的关系

instanceof操作符和isPrototype()方法。

3、 谨慎地定义方法

给子类添加原型的方法的代码一定要放在替换原型的语句之后。

通过原型链实现的继承时，不能使用对象字面量创建原型方法。这样会重写原型方法。

4、 原型链问题

1、 创建子类时不能向超类的构造函数传递参数

2、 超类包含引用类型的属性，通过原型来实现继承时，实际上会变成另一个类型的实例，于是乎超类的实例的所有属性变成了子类的原型属性了。因而引发了共享属性问题(特别是引用类型属性)

借用构造函数（经典继承）

思想：在子类型构造函数的内部调用超类型构造函数。

function A() {
    this.colors = ['red', 'blue', 'green'];
}
//借用构造函数实现继承
function B() {
    A.call(this);        //把A在B的环境中执行，A与B中的this对象指向B的实例
}
var b = new B();
b.colors.push('black');
debug(b.colors);        //['red', 'blue', 'green', 'black']
var b2 = new B();
debug(b2.colors);    //['red', 'blue', 'green']
1、    向超类中传递参数
function A(name) {
    this.name = name;
}
//借用构造函数实现继承
function B(name, age) {
    //把A在B的环境中执行，A与B中的this对象指向B的实例
    A.call(this, name);
    this.age = age;        
}
var b = new B('mackxu', 22);
debug('我的名字是：'+b.name+" 我的年龄："+b.age);

2、 借用构造函数的问题

1)  与构造函数模式一样的问题：在构造函数中定义的方法，无法共享。

2)  更苦逼的事：在超类的原型中定义的方法，对子类不可见

组合继承:(伪经典继承)

思路：使用原型链实现对原型属性和方法的继承，而通过借用构造函数来实现对实例属性的继承。

结果：既通过在原型上定义方法实现了函数的复用，又能够保证每个实例都有它自己的属性。

问题：无论什么情况下，都会调用两次超类型构造函数。一次在创建子类型原型时候、另一次在子类型构造函数内部。造成不得不在子类型构造函数中重写父类的属性。

解决办法：寄生组合式继承[改写了原型链继承]

function A(name) {
    this.name = name;
    this.colors = ['red', 'blue', 'green'];
}
A.prototype = {
    sayName: function() {
        return this.name;
    }
}
//借用构造函数实现继承超类属性
function B(name, age) {
    //把A在B的环境中执行，A与B中的this对象指向B的实例
    A.call(this, name);
    this.age = age;        
}
//原型链继承超类的属性(方法和属性)
B.prototype = new A();
//此处不能用对象字面量赋值(原因前面已经给出)
B.prototype.sayAge = function() {
    return this.age;
}
var b = new B('mackxu', 22);
debug('我的名字是：'+b.sayName()+" 我的年龄："+b.sayAge()+" 我喜欢的颜色:"+b.colors);

原型式继承

借助原型可以基于已有对象创建新对象

function object(obj) {
    function F(){}
    F.prototype = obj;        //对其进行一次浅复制
    return new F();
}

寄生式继承（类寄生构造函数模式、工厂模式）

思路：创建一个仅用于封装继承过程的函数

function createAnother(A) {
    var clone = object(A);
    //以某种方式来增强这个对象
  clone.sayHi = function() {
    debug(‘Hi’);
};
  return clone;
}

寄生组合式继承

//改写原型链继承：
function inheritPrototype(subType, superType) {
    var prototype = object(superType.prototype);    //创建对象[超类原型副本]
    prototype.constructor = subType;                    //增强对象
    subType.prototype = prototype;                    //指定对象
}
代码：
//创建对象的一般步骤[原型式继承]
function object(obj) {
    function F() {}
    F.prototype = obj;
    return new F();
}
/**
 * 改写原型链继承
 * @param {object} subType 子类构造函数
 * @param {object} superType  超类构造函数
 */
function inheritPrototype(subType, superType) {
    var prototype = object(superType.prototype);    //创建对象[超类原型副本]
    prototype.constructor = subType;                //增强对象
    subType.prototype = prototype;                    //指定对象
}
function A(name) {
    this.name = name;
    this.colors = ['red', 'blue', 'green'];
}
A.prototype = {
    sayName: function() {
        return this.name;
    }
}
//借用构造函数实现继承超类属性
function B(name, age) {
    //把A在B的环境中执行，A与B中的this对象指向B的实例
    A.call(this, name);
    this.age = age;        
}
//B.prototype = new A(); //原型链继承超类的属性(方法和属性)
//寄生组合式继承
inheritPrototype(B, A);
//此处不能用对象字面量赋值(原因前面已经给出)
B.prototype.sayAge = function() {
    return this.age;
}
var b = new B('mackxu', 22);
debug('我的名字是：'+b.sayName()+" 我的年龄："+b.sayAge()+" 我喜欢的颜色:"+b.colors);

整理自JavaScript高级程序设计