请描述extends和super关键字在ES6类中的用法。

在ES6的类中，extends和super是两个非常重要的关键字，它们分别用于实现类的继承和子类对父类成员的访问。

文末有我帮助400多位同学成功领取到前端offer的场景题哦

extends

extends关键字用于创建一个类（称为“子类”或“派生类”），该类继承自另一个类（称为“父类”或“基类”）。子类可以访问父类的属性和方法，并可以添加或覆盖它们。

示例：

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

  speak() {
    console.log(`The animal speaks`);
  }
}

// Dog 类通过 extends 继承自 Animal 类
class Dog extends Animal {
  bark() {
    console.log('Woof!');
  }

  speak() {
    super.speak(); // 调用父类的 speak 方法
    this.bark();   // 调用 Dog 类自己的 bark 方法
  }
}

const dog = new Dog('Buddy');
dog.speak(); // 先打印"The animal speaks"，然后打印"Woof!"

super

super关键字在ES6的类中有两种主要的用法：

1. 在子类的构造函数中调用父类的构造函数：在子类的构造函数中，super()被用来调用父类的构造函数。如果子类没有显式地调用super()，并且父类有构造函数，那么JavaScript会抛出一个错误。

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

class Dog extends Animal {
  constructor(name, breed) {
    super(name); // 调用 Animal 类的构造函数
    this.breed = breed;
  }
}

1. 在子类中访问父类的属性和方法：在子类的方法中，super可以用来引用父类的属性和方法。这通常用于覆盖父类的方法，并在子类的方法中调用父类方法的实现。

class Animal {
  speak() {
    console.log(`The animal speaks`);
  }
}

class Dog extends Animal {
  speak() {
    super.speak(); // 调用父类的 speak 方法
    console.log('Woof!');
  }
}

在上述Dog类的speak方法中，我们首先使用super.speak()调用了父类Animal的speak方法，然后打印了’Woof!'。这样，我们就能够保留父类方法的功能，并在其基础上添加新的功能。
堪称2024最强的前端面试场景题，让421人成功拿到offer