JavaScript类继承与class使用教程

本篇文章给大家分享《JavaScript类继承与class用法详解》，覆盖了文章的常见基础知识，其实一个语言的全部知识点一篇文章是不可能说完的，但希望通过这些问题，让读者对自己的掌握程度有一定的认识(B 数)，从而弥补自己的不足，更好的掌握它。

JavaScript中class是语法糖，真正继承靠extends+super()；子类constructor必须首行调用super()，否则无法访问this；super指向父类原型，用于复用方法；继承内置类需特殊处理以确保实例行为正确。

JavaScript 中 class 本身不实现传统继承，它只是 function 和原型链的语法糖；真正起作用的是 extends + super() 的组合。

为什么直接写 class A extends B 会报错 ReferenceError: Must call super constructor

子类构造函数中必须显式调用 super()，否则无法访问 this。这不是可选项，是 JavaScript 引擎强制要求。

• super() 必须在子类 constructor 中第一条语句调用（否则报错）
• 若父类构造函数需要参数，super(arg1, arg2) 必须传入对应参数
• 不写 constructor 时，JavaScript 会自动补一个空的 constructor(...args) { super(...args); }

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

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

super 在方法中不是指“父类实例”，而是指向父类的原型对象

在普通方法里写 super.say()，实际等价于 Object.getPrototypeOf(Object.getPrototypeOf(this)).say.call(this) —— 它查的是父类原型上的方法，不是新建一个父类实例。

• super.xxx 只能在对象方法或 constructor 中使用，不能在普通函数或箭头函数里用
• super 不能单独作为表达式（如 console.log(super) 会语法错误）
• 重写父类方法时，用 super.methodName() 可安全复用逻辑，避免硬编码父类名

class Animal {
  speak() {
    return `${this.name} makes a sound.`;
  }
}

class Cat extends Animal {
  speak() {
    return super.speak().replace('sound', 'meow'); // ✅ 复用并修改
  }
}

继承内置类（如 Array、Error）时，super() 调用方式有差异

继承 Array 等内置类，仅靠 super() 不足以让实例具备完整行为（比如 instanceof Array 为 true，但 length 不响应），需配合 new.target 或额外处理。

• 继承 Error：必须在 constructor 中调用 super(message)，否则 .stack 为空
• 继承 Array：推荐用 return Reflect.construct(Array, args, new.target)（ES6+）或改用组合模式
• 所有继承自内置类的子类，构造函数必须返回一个该内置类型的实例，否则 instanceof 检查可能失败

class MyError extends Error {
  constructor(message) {
    super(message); // ✅ 否则 stack 不包含当前调用位置
    this.name = 'MyError';
  }
}

真正容易被忽略的是：即使语法上写对了 class 和 extends，如果没理解 super() 的执行时机、this 绑定规则、以及内置类的特殊限制，运行时仍会出错或行为异常。

以上就是本文的全部内容了，是否有顺利帮助你解决问题？若是能给你带来学习上的帮助，请大家多多支持golang学习网！更多关于文章的相关知识，也可关注golang学习网公众号。