面试高频！JavaScript 继承与 super 深度解析，快速上手JavaScript 继承与 super 深度解析

JavaScript 继承与 `super` 深度解析：实例化与方法重写

JavaScript 的面向对象编程（OOP）让我们可以通过继承来减少代码重复，并实现功能扩展。继承通过 extends 关键字实现，父类的方法和属性能够被子类继承，子类可以在此基础上进行扩展和重写。

什么是继承？

继承是面向对象编程中的一个核心概念，允许一个类（子类）继承另一个类（父类）的属性和方法。继承使得子类可以直接使用父类的属性和方法，并且可以重写父类的方法来实现子类特定的行为。

父类（超类） ：被继承的类
子类：继承父类的类

继承的语法

在 JavaScript 中，通过 extends 关键字实现继承，子类通过调用 super() 来继承父类的构造函数和属性。

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

  sayHello() {
    console.log('动物的叫声');
  }
}

在这个例子中，Animal 类是父类，它有一个属性 name 和一个方法 sayHello。

如何实现继承？

通过 extends 和 super() 可以让子类继承父类的功能：

super() 用于调用父类的构造函数，这样子类就可以继承父类的属性。
子类可以重写父类的方法，来实现自定义的行为。

示例：`cat` 和 `dog` 继承 `animal`

class Cat extends Animal {
  constructor(name, age, gender) {
    super(name);  // 调用父类构造函数，继承父类的属性
    this.age = age;
    this.gender = gender;
  }

  sayHello() {
    console.log('喵喵喵');  // 重写父类的 sayHello 方法
    super.sayHello();  // 调用父类的 sayHello 方法
  }
}

class Dog extends Animal {
  sayHello() {
    console.log('汪汪汪');  // 重写父类的 sayHello 方法
  }
}

创建实例并调用方法

const d1 = new Dog('dog');
const d2 = new Cat('cat', 18, '母');

console.log(d1);  // Dog { name: 'dog' }
console.log(d2);  // Cat { name: 'cat', age: 18, gender: '母' }

d1.sayHello();  // 输出：汪汪汪
d2.sayHello();  // 输出：喵喵喵  动物的叫声

d1.sayHello() 调用了 Dog 类中的 sayHello 方法，输出 "汪汪汪"。
d2.sayHello() 调用了 Cat 类中的 sayHello 方法，输出 "喵喵喵"，并且通过 super.sayHello() 调用父类 Animal 中的 sayHello 方法，输出 "动物的叫声"。

重点概念解析

extends 关键字
- 用于继承父类的属性和方法。通过 extends，子类能够继承父类所有可继承的内容。
super() 方法
- super() 用于调用父类的构造函数，以便子类继承父类的属性。
- super.method() 可以调用父类的方法，进行扩展或复用。
方法重写
- 子类可以重写父类的方法，来实现不同的行为。如果需要调用父类的方法，可以使用 super.method()。

小结

继承通过 extends 和 super() 实现，子类可以继承父类的属性和方法。
super() 调用父类的构造函数，确保子类正确继承父类的属性。
方法重写：子类可以重写父类的方法，定制自己的行为。
继承不仅减少了重复代码，还增强了代码的扩展性和复用性。

适合面试的总结话术

在 JavaScript 中，继承通过 extends 关键字实现，子类继承父类的属性和方法。使用 super() 方法调用父类的构造函数，并且可以通过 super.method() 调用父类的方法，实现代码的复用和扩展。继承遵循开闭原则：可以在不修改父类的情况下扩展子类的功能。

面试高频！JavaScript 继承与 super 深度解析，快速上手

JavaScript 继承与 super 深度解析：实例化与方法重写