JavaScript 中的类支持继承，允许你创建一个新的类（子类），并且让它继承现有类（父类）的属性和方法。继承是面向对象编程中的重要特性，它使得代码更加模块化、可复用。

在 JavaScript 中，继承通过 extends 关键字实现。子类可以继承父类的实例属性和方法，此外，子类还可以添加自己的属性和方法。

1. 基本语法：

class ChildClass extends ParentClass {
  constructor() {
    super();  // 调用父类的构造函数
    // 子类特有的属性和方法
  }

  // 子类方法
}

• extends：用来声明类的继承关系，表示 ChildClass 继承 ParentClass。
• super()：调用父类的构造函数，必须在子类的构造函数中调用。

2. 继承父类属性和方法：

子类会继承父类的所有实例方法和属性，且可以在子类中使用 super 关键字来调用父类的方法。

示例：

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

  speak() {
    console.log(`${this.name} makes a sound.`);
  }
}

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

  speak() {
    console.log(`${this.name} barks.`);
  }
}

const dog = new Dog("Buddy", "Golden Retriever");
dog.speak();  // 输出: Buddy barks.

• Dog 类通过 extends 关键字继承了 Animal 类。
• super(name) 调用了 Animal 类的构造函数，继承了 name 属性。
• Dog 类重写了 speak() 方法。

3. 使用 super 关键字：

• 调用父类构造函数：子类的构造函数中必须使用 super() 调用父类的构造函数，以便子类可以初始化继承的属性。
• 调用父类方法：可以在子类中使用 super.methodName() 来调用父类的实例方法。

示例：

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  greet() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  }
}

class Student extends Person {
  constructor(name, age, school) {
    super(name, age);  // 调用父类的构造函数
    this.school = school;
  }

  greet() {
    super.greet();  // 调用父类的 greet 方法
    console.log(`I study at ${this.school}.`);
  }
}

const student = new Student("Alice", 20, "Harvard");
student.greet();  // 输出: Hello, my name is Alice and I am 20 years old. I study at Harvard.

• Student 继承了 Person 类，重写了 greet() 方法。
• 使用 super.greet() 调用了父类的 greet() 方法，并在子类中添加了自己的行为。

4. 静态方法的继承：

静态方法是属于类本身的方法，而不是类的实例方法。子类也可以继承父类的静态方法。

示例：

class Animal {
  static info() {
    console.log("Animals are living beings.");
  }
}

class Dog extends Animal {
  static info() {
    super.info();  // 调用父类的静态方法
    console.log("Dogs are domestic animals.");
  }
}

Dog.info();
// 输出:
// Animals are living beings.
// Dogs are domestic animals.

• info() 是一个静态方法，子类 Dog 继承了 Animal 类的静态方法，并通过 super.info() 调用了父类的静态方法。

5. 继承时的构造函数：

子类的构造函数必须调用 super()，否则不能访问 this。这是因为在子类构造函数执行之前，父类的构造函数需要先执行，初始化继承的属性。

示例：

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

class Dog extends Animal {
  constructor(name, breed) {
    super(name);  // 必须调用 super()
    this.breed = breed;
  }
}

const dog = new Dog("Buddy", "Golden Retriever");
console.log(dog.name);  // 输出: Buddy
console.log(dog.breed);  // 输出: Golden Retriever

• Dog 的构造函数调用了 super(name) 来初始化继承自 Animal 类的 name 属性。

6. 继承和方法重写：

子类可以重写父类的方法。如果子类没有重写某个方法，那么它将继承父类的该方法。

示例：

class Animal {
  speak() {
    console.log("Animal makes a sound");
  }
}

class Dog extends Animal {
  speak() {
    console.log("Dog barks");
  }
}

const dog = new Dog();
dog.speak();  // 输出: Dog barks

• Dog 重写了 speak() 方法，当调用 dog.speak() 时，输出的是子类的方法，而不是父类的方法。

7. 多层继承：

JavaScript 类支持多层继承，子类可以继承父类，父类又可以继承其他类的功能。

示例：

class Animal {
  speak() {
    console.log("Animal makes a sound");
  }
}

class Mammal extends Animal {
  walk() {
    console.log("Mammal walks");
  }
}

class Dog extends Mammal {
  speak() {
    console.log("Dog barks");
  }
}

const dog = new Dog();
dog.speak();  // 输出: Dog barks
dog.walk();   // 输出: Mammal walks

• Dog 继承了 Mammal，而 Mammal 又继承了 Animal，形成了一个多层继承的结构。

总结：

• extends：用于继承父类。
• super()：在子类构造函数中调用父类的构造函数。
• 方法重写：子类可以重写父类的方法，覆盖父类行为。
• 静态方法继承：子类可以继承父类的静态方法。
• 多层继承：类支持多层继承，子类可以从多个父类继承属性和方法。

通过继承，JavaScript 类可以建立层次化的对象结构，减少重复代码，提升代码的复用性和可维护性。更多详细文章请关注其他相关文章。