JavaScript解构赋值是提取对象属性和数组元素最简洁高效的方式；支持对象按名解构、重命名、默认值、嵌套解构，数组按位置解构、跳过、剩余运算符、默认值，以及函数参数直接解构和实用技巧如变量交换与API字段提取。

JavaScript 中解构赋值是提取对象属性和数组元素最简洁高效的方式，不用再写一堆 const a = obj.a; const b = obj.b; 这样的重复代码。

对象解构：按属性名直接取值

用大括号 {} 匹配对象的属性名，自动把对应值赋给同名变量：

const user = { name: '张三', age: 28, city: '杭州' };
const { name, age } = user;
console.log(name); // '张三'
console.log(age);  // 28

还可以重命名、设置默认值、嵌套解构：

• 重命名：const { name: fullName, age: years } = user;
• 默认值：const { city = '北京', job = '工程师' } = user;（job 不存在时用默认值）
• 嵌套：const { address: { street, zip } } = { address: { street: '中山路', zip: '310000' } };

数组解构：按位置顺序取元素

用方括号 [] 按索引位置提取，支持跳过、剩余运算符、默认值：

Alibabacloud Sdk Client Initialization For Java

在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。

下载

立即学习“Java免费学习笔记（深入）”；

const colors = ['red', 'green', 'blue', 'yellow'];
const [first, , third] = colors; // 跳过第二个，取第1个和第3个
const [a, b, ...rest] = colors;  // a='red', b='green', rest=['blue','yellow']
const [x = 'default'] = [];       // x = 'default'（空数组时生效）

函数参数中直接解构

在函数形参里写解构，调用时传入对象或数组即可自动提取：

function printUser({ name, age, city = '未知' }) {
  console.log(`${name}，${age}岁，住在${city}`);
}
printUser({ name: '李四', age: 30 }); // 李四，30岁，住在未知

数组参数也一样：function sum([a = 0, b = 0]) { return a + b; }

实用小技巧

解构不只是语法糖，还能提升可读性和健壮性：

• 交换变量：[a, b] = [b, a];
• 快速提取 API 响应字段：const { data: { id, title }, status } = response;
• 避免访问 undefined 属性报错，配合默认值更安全