javaScript 中的类是 es6 引入的语法糖,本质仍是基于原型的构造函数机制;它提升可读性与一致性,但不改变底层逻辑,需理解其与原型链的对应关系才能真正用好。

javascript 中的 类(class) 是 ES6 引入的语法糖,本质上仍是基于原型的构造函数机制,它本身不改变底层运行逻辑,只是让面向对象写法更清晰、更接近传统语言(如 Java、c++)的风格。
类的定义方式
使用 class 关键字声明,内部用 constructor 定义初始化逻辑,其他方法直接写在类体中(无需 function 关键字):
class Person { constructor(name, age) { this.name = name; this.age = age; } sayHello() { return `Hello, I'm ${this.name}`; } Static createAdult(name) { return new Person(name, 18); } }
注意:类声明不会被提升(hoisting),必须先定义后使用;类内部方法默认不可枚举;类必须用 new 调用,不能直接执行。
类与构造函数的本质联系
类在底层会被编译为等价的构造函数+原型赋值代码。比如上面的 Person 类,大致等同于:
立即学习“Java免费学习笔记(深入)”;
function Person(name, age) { this.name = name; this.age = age; } Person.prototype.sayHello = function() { return `Hello, I'm ${this.name}`; }; Person.createAdult = function(name) { return new Person(name, 18); };
- 类的
constructor对应构造函数本身 - 类中的实例方法自动挂载到
prototype上 - 类中的静态方法直接挂载到构造函数自身
-
new class {...}和new function(){...}都会创建实例并绑定原型链
关键区别
- 语法简洁性:类统一了方法定义位置,避免手动操作
prototype,也省去重复写function - 语义明确性:
static、extends、super等关键字让继承、静态成员、父类调用更直观 - 限制更严格:类内部所有代码自动运行在严格模式下;类名在类内部不可重新赋值;无法在类中定义属性(ES2022 前需在
constructor或通过字段声明语法prop = value) - 继承机制一致但写法不同:构造函数用
Parent.call(this)+Object.setPrototypeOf(Child.prototype, Parent.prototype);类用extends+super(),更安全且强制要求子类constructor调用super
什么时候该用类?
不是必须用类才能写面向对象代码,但以下情况推荐使用:
- 需要多层继承或复杂继承关系时(
extends比手动设置原型链更可靠) - 团队协作中强调可读性和一致性(类结构一目了然)
- 使用现代工具链(typescript、Babel、打包器)时,类更容易做类型检查和编译优化
- 要配合装饰器(如
@readonly)、私有字段(#field)等新特性时(这些只支持类语法)
基本上就这些。类不是新机制,而是让老机制更好用的那层“糖”。理解它背后仍是构造函数和原型链,才能真正用好它。