ES6里关于类的拓展：继承与派生类

Posted 2020-10-17 古兰精

继承与派生类

　　在ES6之前，实现继承与自定义类型是一个不小的工作。严格意义上的继承需要多个步骤实现

function Rectangle(length, width) {
    this.length = length;
    this.width = width;
}
Rectangle.prototype.getArea = function() {
    return this.length * this.width;
};
function Square(length) {
    Rectangle.call(this, length, length);
}
Square.prototype = Object.create(Rectangle.prototype, {
    constructor: {
        value:Square,
        enumerable: true,
        writable: true,
        configurable: true
    }
});
var square = new Square(3);
console.log(square.getArea()); // 9
console.log(square instanceof Square); // true
console.log(square instanceof Rectangle); // true

　　Square继承自Rectangle，为了这样做，必须用一个创建自Rectangle.prototype的新对象重写Square.prototype并调用Rectangle.call()方法。JS新手经常对这些步骤感到困惑，即使是经验丰富的开发者也常在这里出错

　　类的出现让我们可以更轻松地实现继承功能，使用熟悉的extends关键字可以指定类继承的函数。原型会自动调整，通过调用super()方法即可访问基类的构造函数

class Rectangle {
    constructor(length, width) {
        this.length = length;
        this.width = width;
    }
    getArea() {
        return this.length * this.width;
    }
}
class Square extends Rectangle {
    constructor(length) {
        // 与 Rectangle.call(this, length, length) 相同
        super(length, length);
    }
}
var square = new Square(3);
console.log(square.getArea()); // 9
console.log(square instanceof Square); // true
console.log(square instanceof Rectangle); // true

　　这一次，square类通过extends关键字继承Rectangle类，在square构造函数中通过super()调用Rectangle构造函数并传入相应参数。请注意，与ES5版本代码不同的是，标识符Rectangle只用于类声明(extends之后)

　　继承自其他类的类被称作派生类，如果在派生类中指定了构造函数则必须要调用super()，如果不这样做程序就会报错。如果选择不使用构造函数，则当创建新的类实例时会自动调用super()并传入所有参数

class Square extends Rectangle {
    // 没有构造器
}
// 等价于：
class Square extends Rectangle {
    constructor(...args) {
        super(...args);
    }
}

　　示例中的第二个类是所有派生类的等效默认构造函数，所有参数按顺序被传递给基类的构造函数。这里展示的功能不太正确，因为square的构造函数只需要一个参数，所以最好手动定义构造函数