如何使用static关键字在ES6 class中定义无需实例化的静态属性与方法-js教程-PHP中文网

static用于定义类本身的属性和方法，不依赖实例，只能通过类名访问；静态方法不可用this访问实例，静态属性自es2022起支持类内声明，多个实例共享，子类继承时this指向子类。

如何使用static关键字在es6 class中定义无需实例化的静态属性与方法

在 ES6 class 中，static 关键字用于定义**属于类本身、不依赖实例对象**的属性和方法。它们不能通过 this 访问，也不能被实例调用，只能直接通过类名访问。

静态方法：用 static 声明，类名直接调用

静态方法通常用于工具函数、工厂方法或与类逻辑相关但无需访问实例状态的操作。

语法：在方法名前加 static
调用方式：只能用 ClassName.methodName()，不能用 instance.methodName()
内部无法使用 this 指向实例（此时 this 指向类本身）

例如：

class MathUtils {
  static add(a, b) {
    return a + b;
  }
  static PI = 3.14159;
}

console.log(MathUtils.add(2, 3)); // 5
console.log(MathUtils.PI);        // 3.14159
// new MathUtils().add(2, 3); // ❌ 报错：not a function

静态属性：ES2022 起支持顶层 static 声明（推荐）

早期需在类外部赋值（如 MyClass.prop = value），现在可直接在 class 内部用 static 定义属性。

ES6-ES11新特性相关课件

下载

支持原始值、对象、函数等任意类型
多个实例共享同一份静态属性（类似“类级别变量”）
注意：若为对象或数组，修改其内部属性会影响所有访问者

例如：

class ApiClient {
  static baseUrl = 'https://api.example.com';
  static defaultHeaders = { 'Content-Type': 'application/json' };
  static requestCount = 0;

  static makeRequest(url) {
    this.requestCount++; // 修改静态属性
    return fetch(this.baseUrl + url, {
      headers: this.defaultHeaders
    });
  }
}

console.log(ApiClient.baseUrl); // "https://api.example.com"
ApiClient.makeRequest('/users'); 
console.log(ApiClient.requestCount); // 1

静态方法中访问静态属性：用 this 或类名

在 static 方法内部，this 指向当前类，因此可直接用 this.staticProp 访问同类的其他静态成员。

推荐用 this，便于子类继承时自动指向子类（符合静态方法的动态绑定特性）
也可写死类名（如 MyClass.prop），但会失去继承灵活性

例如子类继承后调用：

class AdminClient extends ApiClient {
  static baseUrl = 'https://admin.api.example.com';
}

console.log(AdminClient.baseUrl); // "https://admin.api.example.com"
AdminClient.makeRequest('/stats'); 
console.log(AdminClient.requestCount); // 2（共享父类静态属性）