ES12 中的类继承方式更加灵活

ES6 中引入了类（class）这一概念，使得 JavaScript 的面向对象编程更加规范化。而 ES12 进一步增强了类的功能，其中最重要的扩展是关于类继承的灵活性。

简单继承

在 ES6 中，我们可以使用 extends 关键字来实现简单的类继承，代码如下：

// javascriptcn.com 代码示例
class Animal {
  constructor(name) {
    this.name = name;
  }
  
  speak() {
    console.log(`${this.name} makes a noise.`);
  }
}

class Dog extends Animal {
  constructor(name) {
    super(name); // 调用父类的 constructor 方法
  }
  
  speak() {
    console.log(`${this.name} barks.`);
  }
}

const dog = new Dog('Lucky');
dog.speak(); // "Lucky barks."

在这个例子中，我们定义了 Animal 和 Dog 两个类，其中 Dog 继承了 Animal。在 Dog 的 constructor 中，我们使用 super 来调用父类（即 Animal）的 constructor 方法，从而设置该实例的 name 属性。我们还重写了父类的 speak 方法，在控制台输出“某某 barks.” 的字符串。

多重继承

ES12 扩展了多重继承的功能，让我们可以更加灵活地使用类。具体来说，ES12 引入了 mixin（混入）这一概念，可以将多个类的属性和方法合并到一个类中。

下面是一个简单的示例代码：

// javascriptcn.com 代码示例
class Animal {
  constructor(name) {
    this.name = name;
  }
  
  speak() {
    console.log(`${this.name} makes a noise.`);
  }
}

class Swimmable {
  swim() {
    console.log(`${this.name} is swimming.`);
  }
}

class Flying {
  fly() {
    console.log(`${this.name} is flying.`);
  }
}

class FlyingFish extends Animal {
  constructor(name) {
    super(name);
  }
}

Object.assign(FlyingFish.prototype, Swimmable.prototype, Flying.prototype);

const nemo = new FlyingFish('Nemo');
nemo.speak(); // "Nemo makes a noise."
nemo.swim(); // "Nemo is swimming."
nemo.fly(); // "Nemo is flying."

在这个例子中，我们定义了 Animal、Swimmable 和 Flying 三个类，它们分别表示动物、游泳和飞行。注意到这三个类都没有定义 name 属性，因此我们需要在子类中继承该属性。

我们定义了一个 FlyingFish 类，继承自 Animal。然后使用 Object.assign 方法将 Swimmable 和 Flying 类的所有属性和方法都合并到 FlyingFish 中，给它赋予了游泳和飞行功能。

最后我们创建了一个 FlyingFish 实例，可以看到它可以执行动物的 speak 方法、游泳、飞行，具有多重继承的特性。

总结

ES12 中的类继承方式更加灵活，支持多重继承和混入等特性。在实际开发中，应当根据具体情况选择不同的继承方式，以使代码更加易读、易维护、易扩展。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65473fcf7d4982a6eb19dde4