ES6 中的类 (Class) 与继承

在 ES6 中，我们可以使用类 (Class) 来定义对象的行为和属性。类是一种模板，用于创建具有相同属性和方法的对象。类的定义方式类似于函数，但是有很多不同之处。

定义一个类

我们可以使用 class 关键字来定义一个类。类名的首字母通常大写。

class Animal {
  constructor(name) {
    this.name = name;
  }

  sayName() {
    console.log(`My name is ${this.name}.`);
  }
}

上面的代码定义了一个 Animal 类，它有一个构造函数和一个 sayName 方法。构造函数用于初始化对象的属性，sayName 方法用于打印对象的名字。

创建一个对象

我们可以使用 new 关键字来创建一个对象。

const dog = new Animal('Dog');
dog.sayName(); // My name is Dog.

上面的代码创建了一个名为 Dog 的 Animal 对象，并调用了它的 sayName 方法。

类的继承

在 ES6 中，我们可以使用 extends 关键字来实现类的继承。

class Cat extends Animal {
  constructor(name, color) {
    super(name);
    this.color = color;
  }

  sayColor() {
    console.log(`My color is ${this.color}.`);
  }
}

上面的代码定义了一个 Cat 类，它继承了 Animal 类。Cat 类有一个构造函数和一个 sayColor 方法。构造函数使用 super 关键字来调用父类的构造函数，并初始化 color 属性。sayColor 方法用于打印对象的颜色。

const cat = new Cat('Cat', 'White');
cat.sayName(); // My name is Cat.
cat.sayColor(); // My color is White.

上面的代码创建了一个名为 Cat 的 Cat 对象，并调用了它的 sayName 和 sayColor 方法。

总结

ES6 中的类 (Class) 和继承提供了一种更加优美和简洁的方式来定义对象的行为和属性。通过继承，我们可以避免重复编写相同的代码，提高代码的复用性和可维护性。如果你还没有使用 ES6 的类和继承，那么现在就是时候开始学习了。

示例代码

class Animal {
  constructor(name) {
    this.name = name;
  }

  sayName() {
    console.log(`My name is ${this.name}.`);
  }
}

const dog = new Animal('Dog');
dog.sayName(); // My name is Dog.

class Cat extends Animal {
  constructor(name, color) {
    super(name);
    this.color = color;
  }

  sayColor() {
    console.log(`My color is ${this.color}.`);
  }
}

const cat = new Cat('Cat', 'White');
cat.sayName(); // My name is Cat.
cat.sayColor(); // My color is White.

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