JavaScript解构赋值通过大括号{}匹配对象结构，可同时提取多个属性；支持重命名、默认值及嵌套解构，未匹配属性返回undefined而非报错。
JavaScript 中用解构赋值同时获取多个对象的属性，核心是用大括号 {} 匹配对象结构，并在一次表达式中列出所需属性名。
基础写法：直接解构一个对象
最常见的是从单个对象中提取多个属性：
const user = { name: 'Alice', age: 30, city: 'Beijing' };
const { name, age, city } = user;
console.log(name, age, city); // Alice 30 Beijing
注意：属性名必须与对象中键名完全一致；顺序无关；未声明的属性会得到 undefined（不会报错）。
解构多个对象：分别声明，或嵌套解构
JavaScript 不支持一行语法直接解构“多个独立对象”（如 const {a} = obj1, {b} = obj2），但有几种实用方式：
立即学习“Java免费学习笔记（深入）”；
Alibabacloud Sdk Client Initialization For Java
下载
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
- 分开写多行解构：清晰、易读、推荐用于不同对象
const person = { name: 'Bob', job: 'Engineer' };
const address = { street: 'Main St', zip: '10001' };
const { name, job } = person;
const { street, zip } = address;
console.log(name, job, street, zip); // Bob Engineer Main St 10001
- 合并对象后统一解构（适合属性不冲突时）
const merged = { ...person, ...address };
const { name, job, street, zip } = merged;
⚠️ 注意：若两个对象有同名属性（如都含 city），后者会覆盖前者。
进阶技巧：重命名、默认值、嵌套解构
实际开发中常需处理属性名冲突或缺失情况：
-
重命名：用
oldName: newName语法避免变量名重复
const user1 = { id: 1, name: 'Tom' };
const user2 = { id: 2, name: 'Jerry' };
const { id: userId1, name: userName1 } = user1;
const { id: userId2, name: userName2 } = user2;
-
设置默认值：防止属性不存在时为
undefined
const { country = 'China', level = 'junior' } = user1;
- 嵌套对象解构：一层或多层深入取值
const data = {
profile: { avatar: 'avatar.png', bio: 'Frontend dev' },
stats: { posts: 42, followers: 1200 }
};
const {
profile: { avatar, bio },
stats: { posts }
} = data;
console.log(avatar, bio, posts); // avatar.png Frontend dev 42
小提醒：解构失败不会报错，但要留意 undefined
如果尝试解构一个不存在的属性，对应变量值为 undefined，不是错误：
const { phone, email } = { name: 'Lily' };
console.log(phone); // undefined
需要时可配合默认值、可选链（?.）或提前校验对象是否存在。
