前端开发js中的class(类)继承

概要

类继承是 JavaScript 中实现面向对象编程的机制之一。它允许我们创建一个基类并从基类派生出一个或多个派生类。派生类继承了基类的属性和方法，并可以添加自己的属性和方法。

整体架构流程

1. 定义基类（父类）：使用 class 关键字来声明基类，定义基类的属性和方法。
2. 定义派生类（子类）：使用 class 关键字来声明派生类，并使用 extends 关键字指定基类。
3. 在派生类中的构造函数中调用 super() 方法来调用基类的构造函数，传递必要的参数。
4. 在派生类中可以添加自己的属性和方法，以扩展基类的功能。
5. 创建派生类的实例，可以调用继承的方法和属性。

技术名词解释

• 基类（父类/超类）：定义一个通用的模板，包含属性和方法，供派生类继承。
• 派生类（子类/继承类）：从基类派生出来的类，继承了基类的属性和方法，并可以添加自己的属性和方法。

技术细节

• extends 关键字：用于指定一个类继承自哪个基类。
• super() 方法：在派生类的构造函数中调用基类的构造函数，用于传递初始化参数和执行基类的构造逻辑。
• 方法重写（Method overriding）：派生类可以重写基类中的方法，以改变其实现或添加额外逻辑。
• super 关键字：用于在派生类中调用基类的方法或属性。

例子

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

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

// 派生类
class Dog extends Animal {
  constructor(name, breed) {
    super(name);
    this.breed = breed;
  }

  // 重写基类的方法
  speak() {
    console.log(`I am a ${this.breed} dog named ${this.name}`);
  }

  // 添加自己的方法
  fetch() {
    console.log(`${this.name} is fetching the ball.`);
  }
}

// 创建派生类的实例
const dog = new Dog("Buddy", "Golden Retriever");
dog.speak(); // 输出: I am a Golden Retriever dog named Buddy
dog.fetch(); // 输出: Buddy is fetching the ball.

小结

类继承是 JavaScript 中的一种面向对象编程机制，它允许派生类从基类中继承属性和方法，同时也可以扩展自身的功能。通过类继承，我们可以组织和重用代码，并创建更高级的数据模型。它提供了一种结构化的方式来定义对象之间的关系，并能够更好地管理代码的复杂性。