[JavaScript知识库]JavaScript中的继承（3）

1.uber-子对象访问父对象的方式

在一般的面向对象语言中，通常都会提供一种用于子类访问父类的特殊语法，因为我们在实现子类方法时往往要父类方法的额外辅助。在这种情况下，子类通常就要去调用父类中的同名方法，以便最终完成工作。
JS中虽然没有这种语法，但是可以实现类似功能。
接下来，在之前构建的继承关系中引入一个uber属性，并令其指向父级原型对象。

function Shape(){}
//    augment prototype
Shape.prototype.name = 'shape';
Shape.prototype.toString = function () {
    var cst = this.constructor;
    return cst.uber
        ? this.cst.uber.toString() + ', ' + this.name
        : this.name;
};

function TwoDShape(){}
//take care of inheritance
var F = function(){};
F.prototype = Shape.prototype;
TwoDShape.prototype =new F();
TwoDShape.prototype.constructor = TwoDShape;
TwoDShape.uber = Shape.prototype;
//augment prototype
TwoDShape.prototype.name = '2D shape';

function Triangle(side, height){
    this.side = side;
    this.height = height;
}

//take care of inheritance
var F = function() {};
F.prototype = TwoDShape.prototype;
Triangle.prototype = new F();
Triangle.prototype.constructor = Triangle;
Triangle.prototype.constructor = TwoDShape.prototype;
//augment prototype
Triangle.prototype.name = 'Triangle'
Triangle.prototype.getArea = function () {
    return this.side * this.height / 2;
}

对于这段代码，新增的部分有：

• 将uner属性设置成指向其父级原型的引用
• 对toString()方法进行了更新
  在此之前，toString所做的仅仅是返回this.name的内容而已。现在为其新增了一项额外任务，即检查对象中是否存在this.constructor.uber属性，如果存在，就先调用该属性的toString方法。由于this.constructor本身是一个函数，而this.constructor.uber是指向当前对象父级原型的引用。所以当我们调用Triangle实体的toString方法时，其原型链上所有的toString都会被调用。

2.将继承部分封装成函数

下面，将之前的实现继承关系的代码提炼出来，并封装进一个名字叫做extend的方法中：

function extend(Child, Parent){
    var F = function(){};
    F.prototype = Parent.prototype;
    Child.prototype= new F();
    Child.prototype.constructor = Child;
    Child.uber = Parent.prototype;
}

//实现继承

extend(TwoDShape, Shape);
extend(Triangle, TwoDShape);

下面看一个完整的例子：

function extend(Child, Parent){
    var F = function(){};
    F.prototype = Parent.prototype;
    Child.prototype= new F();
    Child.prototype.constructor = Child;
    Child.uber = Parent.prototype;
}

//实现继承

function Shape(){};
Shape.prototype.name = 'Shape';
Shape.prototype.toString = function(){
    return this.constructor.uber ?
        this.constructor.uber.toString() + ', '+ this.name
        : this.name;
};

function TwoDShape() {};
extend(TwoDShape, Shape);
TwoDShape.prototype.name = '2D Shape';


function Triangle(side,height) {
    this.side = side;
    this.height = height;
}

extend(Triangle, TwoDShape);

Triangle.prototype.name = 'Triangle';
Triangle.prototype.getArea= function () {
    return this.side * this.height / 2;
};

3.属性拷贝

在构建可重用的继承代码时，我们也可以简单的将父对象的属性拷贝给子对象，参照之前的extend()接口，我们可以创建一个extend2()函数，该函数也可以接收两个构造器函数为参数，并将Parent的原型的所有属性全部拷贝给Child的原型，其中包括方法。因为方法也是一种函数类型的属性。

function extend2(Child, Parent){
    var p = Parent.prototype;
    var c = Child.prototype;
    for (var i in p){
        c[i] = p[i];
    }
    c.uber = p;
}

如此，通过一个简单的循环遍历了函数所接受的所有属性。在之前的示例中，如果子对象主要访问父对象的方法，可以通过设置uber属性来实现。而这里的情况与之前有所不同，由于我们已经完成了对Child原型进行扩展，不需要再去重置Child.prototype.constructor属性，因为它不会再被完全覆盖了，因此在这里，constructor属性所指向的值是正确的。
这种方法只适用于包含基本类型的对象，所有的对象类型（函数与数组）都是不可复制的，因为那他们只支持引用传递。

下面有两个构造器函数Shape()和TwoDShape()。其中，Shape()的原型中包含了一个基本类型属性name，和一个非基本类型属性toString方法：

var Shape = function(){};
var TwoDShape = function(){};
Shape.prototype.name = 'shape';
Shape.prototype.toString = function(){
    return  this.uber
    ? this.uber.toString() + ', ' + this.name
        : this.name;
    
};

如果通过extend()方法来实现继承，name属性既不会是TwoDShape()示例的属性，也不会成为其原型对象的属性，但是子对象依然可以通过继承方式来访问属性。

如果继承是通过extend2来实现的，TwoDShape的原型中就会拷贝获得属于自己的name属性。同样，其中也会拷贝属于自己的toString方法，但这只是已和函数引用，函数本身并没有再次被创建。