javascript中class语法是什么_与传统构造函数有何不同呢

夜晨 2026-01-05 00:00:00 次阅读

class 是语法糖，本质仍是基于原型的构造函数；它不改变 JavaScript 原有原型机制，仅封装写法，方法挂载在 prototype 上，且 class 声明不提升、方法不可枚举、继承强制 super() 调用。

class 是语法糖，本质仍是基于原型的构造函数

JavaScript 的 class 不是引入了新的面向对象模型，它只是对已有原型链机制的封装写法。底层所有行为（如方法查找、this 绑定、继承逻辑）依然走 prototype 那一套。你写一个 class Person，最终生成的仍然是一个函数对象，其 Person.prototype 上挂载着你定义的实例方法。

class 声明不会被提升，而 function 声明会

这是最常踩的坑之一：你不能在声明前使用 class，否则抛出 ReferenceError: Cannot access 'X' before initialization；但 function Person() {} 可以在声明前调用（因为函数声明会被提升）。

console.log(new Person()); // ReferenceError
class Person {
  constructor(name) {
    this.name = name;
  }
}

原因在于 class 声明处于「暂时性死区」（TDZ），和 let/const 一样。

class 内部方法默认不可枚举，constructor 必须显式定义

传统构造函数中，你直接往 MyClass.prototype 上挂函数，那些函数默认是可枚举的；而 class 中定义的所有方法（包括 constructor）都会自动设置 enumerable: false，这更符合“实例方法不应出现在 for...in 中”的直觉。

class 中不写 constructor，会自动生成空函数；写了就必须是函数，不能省略或写成箭头函数
静态方法用 static 关键字声明，它们绑定在类本身而非原型上，等价于直接赋值给 MyClass.methodName
类字段（如 value = 123）是 ES2025 正式特性，不是所有环境默认支持，需注意 Babel 或 TS 编译配置

继承时 super() 调用有强制约束

子类 constructor 中必须在访问 this 前调用 super()，否则报错 ReferenceError: Must call super constructor in derived class before accessing 'this'。这不是可选建议，是语言强制规则。

class Animal {
  constructor(name) {
    this.name = name;
  }
}
class Dog extends Animal {
  constructor(name, breed) {
    console.log(this); // ❌ 报错：不能在 super() 前访问 this
    super(name);
    this.breed = breed;
  }
}

而传统构造函数模拟继承（如 Child.prototype = Object.create(Parent.prototype)）没有这类语法检查，容易漏掉 Parent.call(this) 导致 this 指向错误。