JavaScript 类
类为定义带有构造函数和方法的对象提供了语法。new 可以创建实例，本课演示最后显示 tea / regular / mint。
定义类和构造函数
创建实例时会运行构造函数，并初始化实例字段。
class Drink {
constructor(name, size) {
this.name = name;
this.size = size;
}
}
const order = new Drink("tea", "regular");
构造函数把值保存到新对象中。this 表示当前实例，new Drink(...) 会创建实例并运行构造函数。
添加实例方法
方法描述实例可以执行的操作。
class Drink {
constructor(name, size) { this.name = name; this.size = size; }
label() { return this.name + " / " + this.size; }
}
const order = new Drink("tea", "regular");
console.log(order.label());
order.label() 返回 tea / regular。类方法位于原型上，由各个实例共享。
扩展类
extends 建立继承关系，super(...) 调用父类构造函数，super.label() 使用继承的方法。
class SpecialDrink extends Drink {
constructor(name, size, extra) { super(name, size); this.extra = extra; }
fullLabel() { return super.label() + " / " + this.extra; }
}
const special = new SpecialDrink("tea", "regular", "mint");
console.log(special.fullLabel());
SpecialDrink 继承 label()，并添加 extra 和 fullLabel()。输出是 tea / regular / mint。派生类构造函数必须先调用 super(...)，再使用 this。
静态方法和私有字段
静态方法属于类本身，而不属于实例。像 #secret 这样的私有字段只能在类内部读取。
class Drink {
static kind() { return "drink"; }
#secret = "recipe";
reveal() { return this.#secret; }
}
console.log(Drink.kind());
console.log(new Drink().reveal());
静态方法要写成 Drink.kind()，不能写成 new Drink().kind()。类外部无法访问 drink.#secret。
在页面中查看类
这个演示会把特殊实例的结果写入文档。
<p id="result"></p>
<script>
class Drink { constructor(name,size){this.name=name;this.size=size;} label(){return this.name+" / "+this.size;} }
class SpecialDrink extends Drink { constructor(name,size,extra){super(name,size);this.extra=extra;} fullLabel(){return super.label()+" / "+this.extra;} }
const order=new SpecialDrink("tea","regular","mint");
document.querySelector("#result").textContent=order.fullLabel();
</script>
页面会准确显示 tea / regular / mint。类声明在声明之前不可使用；这属于 temporal dead zone，不应误称为 hoisting。
类用于组织对象的创建和共享行为。它不同于组织文件的模块，也不同于直接写在某个对象上的方法。
📊 类的特性
| 语法 | 作用 | 示例 |
|---|---|---|
constructor(...) |
初始化新实例 | constructor(name, size) |
this |
指向当前实例 | this.name = name |
extends 和 super |
复用父类行为 | class SpecialDrink extends Drink |
static |
定义类方法 | Drink.kind() |
这个表格总结了本课使用的核心类语法。
实践练习
创建带有 name、size 和 label() 的 Drink。再用 extends 创建 SpecialDrink，添加 extra，让 fullLabel() 显示 tea / regular / mint，并调用 Drink.kind()。
常见错误
不要在类上调用实例方法，不要忘记派生构造函数中的 super(...)，也不要在它之前使用 this。
要点
构造函数初始化字段，方法通过原型共享，继承则复用已有行为。
🧠 测试您的知识
测试您的知识
通过这个互动测验挑战自己，看看你对这个主题的理解程度如何
📝 说明
- 仔细阅读每个问题
- 为每个问题选择最佳答案
- 您可以随时重新参加测验
- 您的进度将显示在顶部