JavaScript类中可用计算属性名(如[expr])定义方法、getter、setter和静态成员,表达式在类定义时求值且需返回合法标识符字符串,不支持constructor或this引用。

JavaScript 中可以在类定义中使用计算属性名(computed property name),方式和对象字面量类似,用方括号 [] 包裹表达式即可。它适用于方法、getter、setter 和静态成员,但不能用于构造函数或类名本身。
在类方法中使用计算属性名
你可以在类的方法定义中用 [expression] 动态生成方法名,表达式会在类定义时求值(不是实例化时):
- 表达式必须是有效的标识符字符串,否则运行时报错(如返回空字符串、含空格或以数字开头)
- 常用于根据配置、环境变量或常量生成方法名
const methodName = 'getData';
class ApiClient {
[methodName]() {
return 'fetched';
}
}
console.log(new ApiClient().getData()); // 'fetched'
配合 Symbol 或动态键生成唯一方法
计算属性名支持任意字符串或 Symbol,适合封装私有逻辑或避免命名冲突:
-
Symbol可保证方法名唯一且不可枚举(但类内部仍可访问) - 也可用模板字符串拼接,比如基于版本号或模块名
const PRIVATE_ACTION = Symbol('doInternalWork');
class Service {
[PRIVATE_ACTION]() {
return 'internal result';
}
run() {
return this[PRIVATE_ACTION]();
}
}
静态成员与 getter/setter 同样适用
静态方法、静态 getter、实例 getter/setter 都支持计算属性名:
- 静态成员的计算名在类定义时解析,与实例无关
- getter/setter 的计算名需确保返回合法字符串,否则定义失败
const propKey = 'userName';
class User {
static ['get' + 'Version']() {
return '1.2.0';
}
get [propKey]() {
return this._name || 'anonymous';
}
set [propKey](value) {
this._name = value?.trim();
}
}
注意事项与常见错误
计算属性名看似灵活,但有几个关键限制要留意:
- 不能用于
constructor—— 类构造器名固定为constructor,不支持计算 - 表达式不能引用
this(类定义时this尚未绑定) - 若表达式抛错(如访问 undefined 属性),整个类定义会失败
- Babel 或旧引擎需开启 ES2015+ 支持,现代浏览器均原生支持
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南











