JavaScript对象解构不支持直接用变量作属性名，但可通过计算属性名{[key]: targetVar}实现动态提取；key需已定义且求值为合法字符串，支持默认值、剩余属性及错误防护，复杂场景下方括号访问更直观。
JavaScript 中对象解构本身不支持直接用变量作为属性名进行解构，但可以通过「计算属性名 + 解构赋值」的组合方式实现动态属性名的提取。
动态属性名必须配合计算属性语法
解构左侧不能直接写变量，但可以使用方括号 [] 包裹表达式，让属性名在运行时计算。这是 ES6 支持的「计算属性名」语法，需和解构赋值结合使用：
- 写法是：
{ [key]: targetVar } = obj，其中key是字符串或可转为字符串的表达式 -
key必须已定义（不能是未声明变量），且最终求值得到一个合法属性名（如"name"、"user_123"） - 注意：不能省略冒号，
[key]是属性名，右边才是要赋值的变量名
常见实用写法示例
✅ 正确用法：
const obj = { name: "Alice", age: 30 };
const key = "name";
const { [key]: userName } = obj;
console.log(userName); // "Alice"
✅ 多个动态属性（需分别写）：
立即学习“Java免费学习笔记（深入）”；
const obj = { title: "JS Guide", author: "Bob", year: 2024 };
const key1 = "title";
const key2 = "author";
const { [key1]: bookTitle, [key2]: bookAuthor } = obj;
console.log(bookTitle, bookAuthor); // "JS Guide" "Bob"
❌ 错误写法（语法错误）：
const key = "name";
const { key: userName } = obj; // ❌ 解构出的是字面量 "key"，不是变量值
处理不确定是否存在属性的情况
动态解构同样支持默认值和解构失败防护：
- 加默认值：
{ [key]: value = "default" } = obj - 避免报错（属性不存在时设为
undefined）：只要不开启严格模式或不依赖该值，就不会报错；若想更稳妥，可先检查obj[key] !== undefined - 与剩余属性结合：
{ [key]: dynamicVal, ...rest } = obj也合法
替代方案：用方括号访问更直观
如果逻辑较复杂（比如 key 来自用户输入、API 响应等），有时直接用传统访问更清晰：
const key = getDynamicKey(); const value = obj[key]; // 简单明了，无需解构语法糖
解构优势在于批量提取 + 重命名，动态场景下若只取一个值，普通访问反而更易读、更易调试。
