ES6中对象的计算属性名用方括号包裹表达式实现动态设置，表达式结果必须是字符串或可隐式转为字符串的值，如数字；常见写法包括变量、模板字符串、函数调用等，不可省略方括号，且不支持纯标识符未声明直接使用。
ES6 中对象的计算属性名，是用方括号 [] 包裹一个表达式来实现动态设置属性名的写法。
语法格式：用方括号包裹变量或表达式
在对象字面量中，把属性名写成 [表达式] 的形式，JavaScript 会在创建对象时求值该表达式，并将其结果作为属性名使用。
- 表达式可以是变量、函数调用、字符串拼接、甚至三元运算等
- 表达式结果必须是字符串或能被隐式转为字符串的值（如数字）
- 不能是纯标识符（比如
[foo]而没声明foo会报错）
常见用法示例
✅ 正确写法：
const key = 'name';
const obj = {
[key]: 'Alice', // 动态设为 name: 'Alice'
['user' + Math.random()]: true, // 拼接字符串
[`id_${Date.now()}`]: 123, // 模板字符串
[Object.keys({a:1})[0]]: 'a' // 表达式返回 'a'
};
❌ 错误写法（不加方括号就是字面量，不会计算）：
立即学习“Java免费学习笔记（深入）”；
const key = 'age';
const obj = {
key: 25 // 属性名就是 'key'，不是 'age'
};
配合解构和函数参数更实用
常用于工具函数中灵活生成对象：
function createField(name, value) {
return {
[name]: value,
[`is${name.charAt(0).toUpperCase() + name.slice(1)}`]: typeof value === 'string'
};
}
createField('title', 'ES6')
// → { title: 'ES6', isTitle: true }
注意点
- 计算属性名不能省略引号（即使结果是合法标识符），否则语法错误
- 不能在对象方法简写中直接用计算名定义方法名（需额外处理），例如：
{ [key]() {} }是合法的 - 与 getter/setter 一起用也支持：
{ get [key]() { return this._val; } }
