JavaScript 中 class 中字段声明怎么使用-js教程-PHP中文网

在 javascript 中，类字段（class fields）通过直接在 class 内部声明变量来定义实例属性或静态属性，无需使用构造函数。实例字段在每次创建对象时自动初始化，而静态字段则属于类本身，通过 static 关键字标记。

JavaScript 中 class 中字段声明怎么使用

如何声明和访问实例字段？

实例字段直接在类的主体中声明，赋值语句即为默认值。访问时通过实例对象的属性名获取，若未赋值则为 undefined。

JavaScript 中 class 中字段声明怎么使用

class User {
  name = 'Guest';
  age = 0;
}

const user = new User();
console.log(user.name); // Guest
console.log(user.age);  // 0

上述代码展示了最简单的实例字段声明。每个新创建的 User 实例都会拥有独立的 name 和 age 属性。这种写法比在构造函数中逐个赋值更简洁，且避免了忘记初始化的问题。

如何使用静态字段？

静态字段使用 static 关键字声明，它们不属于任何特定实例，而是属于类本身。访问静态字段必须通过类名，而非实例。

javascript-typescript-typescript-scaffold

你是 TypeScript 项目架构专家，专注于脚手架搭建生产就绪的 Node.js 和前端应用。生成包含现代工具链（pnpm、Vite、Next.js）、类型

下载

JavaScript 中 class 中字段声明怎么使用

class Config {
  static version = '1.0.0';
  static count = 0;
}

console.log(Config.version); // 1.0.0
Config.count++;              // 修改静态字段

静态字段常用于存储配置信息、计数器或工具方法。由于它们不依赖于实例状态，因此在所有实例之间共享同一份数据。注意不要通过实例访问静态字段，虽然某些环境可能允许，但这不符合规范。

基于实例初始化顺序的具体问题：字段与构造函数的执行关系是什么？

类字段的初始化发生在构造函数体执行之前。这意味着在构造函数内部可以直接访问已初始化的实例字段，但无法访问尚未初始化的字段（会报错）。这一机制确保了实例状态的早期建立。

class Example {
  value = 10;

  constructor() {
    console.log(this.value); // 10, 字段已初始化
    this.value = 20;         // 可以修改
  }
}

new Example();

在上述代码中，this.value 在构造函数第一行就被正确输出为 10，因为类字段 value = 10 的赋值逻辑在构造函数运行前已完成。如果尝试在构造函数中访问一个未在类级别声明的字段，则会得到 undefined 或抛出引用错误，具体取决于是否使用了严格模式及引擎实现。这种“先字段后构造”的顺序是 ES2022+ 标准的核心行为之一，它简化了状态管理并减少了样板代码。

Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南