javascript中的继承

javascript中的继承主要是通过原型链的方式实现，这里由简入繁介绍集中js中的继承实现方式。

原型链

function SuperType() {
    this.prop = 'super type';
}

SuperType.prototype.getSuperValue = function() {
    return this.prop;
}

function SubType() {
    this.subProp = 'sub type'
}

SubType.prototype = new SuperType();

// 要重新修改constructor的指向，否则会导致子类的construtor指向父类
SubType.prototype.constructor = SubType;

SubType.prototype.getSubValue = function() {
    return this.subProp;
}

var instance = new SubType();
console.log(instance.getSuperValue());

问题：如果父类的属性中包含有引用类型的话，在子类实例中操作引用类型，比如‘给数组添加新元素’。这将导致所有子类对象的改属性都发生变化。

借用构造函数

function SuperType() {
    this.props = ['super', 'type'];
}

function SubType() {
    SuperType.call(this); // 这里借用了父类的构造函数
}

var instance1 = new SubType();
instance1.props.push('sub');
console.log(instance1.props);

var instance2 = new SubType();
console.log(instance2.props)

问题：1、方法都在构造函数中定义，复用无从谈起；2、父类原型的方法在子类中不可见。

组合继承

// 组合继承
function SuperType(name) {
    this.name = name;
    this.colors = ['red', 'green', 'blue'];
}

SuperType.prototype.sayName = function() {
    console.log(this.name);
}

function SubType(name, age) {
    SuperType.call(this, name); // 借用构造函数
    this.age = age;
}

SubType.prototype = new SuperType(); // 原型式继承
SubType.prototype.construtor = SubType;

SubType.prototype.sayAge = function() {
    console.log(this.age);
}

var instance1 = new SubType('Tom', 18);
instance1.colors.push('black');
console.log(instance1.colors);
instance1.sayName();
instance1.sayAge();

function object(o) {
    function F() {}
    F.prototype = o;
    return new F();
}

function SuperType(name) {
    this.name = name;
    this.colors = ['red', 'green', 'blue'];
}

SuperType.prototype.sayName = function() {
    console.log(this.name);
}

function SubType(name, age) {
    SuperType.call(this);
    this.age = age;
}

SubType.prototype = object(SuperType.prototype);
SubType.prototype.construtor = SubType;

SubType.prototype.sayAge = function() {
    console.log(this.age);
}

普遍认为寄生组合式继承是最理想的继承方式。