17370845950

JavaScript继承推荐使用ES6 class extends，其底层基于原型链；手动实现最优方案是寄生组合继承，用Object.create优化组合继承的重复调用问题。

JavaScript 实现继承的核心思路是让子构造函数能访问父构造函数的属性和方法，同时保持原型链正确。现代开发中推荐使用 ES6 class + extends，但理解底层原理（如原型链、call/apply、Object.create）依然重要。

1. ES6 class 继承（推荐，最简洁清晰）

语法糖，底层仍是基于原型链，但可读性和维护性最好，支持 super 调用父类构造器和方法。

• 子类必须在 constructor 中调用 super()，否则会报错（因为需要初始化 this）
• super() 相当于执行父类构造函数，可传参；super.method() 可调用父类方法
• 静态方法、getter/setter、async 方法都可被继承和重写

class Animal {
  constructor(name) {
    this.name = name;
  }
  speak() { return `${this.name} makes a sound`; }
}
class Dog extends Animal {
  constructor(name, breed) {
    super(name); // 必须！
    this.breed = breed;
  }
  speak() { return `${super.speak()} — woof!`; }
}

2. 原型链继承（基础但有缺陷）

将子类的 prototype 指向父类的一个实例。简单但有明显问题：父类实例属性会被所有子类实例共享（引用类型尤其危险）。

• 无法向父构造函数传参
• 引用类型属性（如数组、对象）被所有实例共用
• 子类无法实现函数复用（每次 new 都新建父实例）

3. 构造函数继承（借用 call/apply）

在子类构造函数中用 Parent.call(this, ...args) 执行父类构造逻辑，解决属性私有化问题。

• 可传参，每个子实例都有独立的父类属性
• 但只能继承实例属性和方法，无法继承父类原型上的方法（如 Dog.prototype.speak 不存在）
• 因此通常与原型链或 Object.create 结合使用（组合继承）

4. 组合继承（经典实用方案）

构造函数继承 + 原型链继承结合：用 call 继承实例属性，用 prototype = new Parent() 继承原型方法。

• 避免了原型链继承的共享问题，也补全了构造函数继承缺失的原型方法
• 缺点：父类构造函数被调用了两次（一次在 new Parent() 设原型，一次在 call 中）

5. 寄生组合继承（最优手动方案）

优化组合继承，只调用一次父类构造函数。核心是用 Object.create(Parent.prototype) 设置子类原型，再修正 constructor。

• 避免重复执行父构造函数
• 完整继承实例属性 + 原型方法，且无属性共享风险
• Babel 编译 class 的底层就是它

基本上就这些。日常开发直接用 class extends；想深入理解机制，重点掌握寄生组合继承和 super 的本质；老项目维护可能遇到各种手动写法，知道它们的优劣和适用场景就够了。