解构赋值是JavaScript中改变数据提取方式的语言特性，支持数组按位置、对象按属性名提取值，具备跳过、默认值、重命名、嵌套及剩余元素等能力，且仅浅层解构。
解构赋值不是语法糖，它是 JavaScript 中真正改变数据提取方式的语言特性——它让你跳过 arr[0]、obj.name 这类冗余访问，直接把值“掏出来”绑定到变量上。
数组解构：按位置取值，支持跳过、默认值和剩余元素
数组解构本质是“模式匹配”，左侧的方括号不是数组字面量，而是解构模式。顺序严格对应索引，不关心右侧是否为真数组（只要可迭代即可）。
- 基本用法：
const [a, b] = [1, 2];→a === 1,b === 2 - 跳过某项：用逗号占位，
const [first, , third] = ['a', 'b', 'c'];→first === 'a',third === 'c' - 设置默认值：仅当对应位置值为
undefined时生效，const [x = 10, y = 20] = [5];→x === 5,y === 20 - 获取剩余元素：用扩展运算符
...，const [head, ...tail] = [1, 2, 3, 4];→tail是新数组[2, 3, 4]，不是类数组
注意：let [] = someArray; 合法但无意义；const [] = []; 也合法。解构失败不会报错，只是绑定为 undefined（除非左侧有必须初始化的 const 变量且右侧无对应值）。
对象解构：按属性名取值，支持重命名、嵌套和默认值
对象解构不依赖顺序，只认属性名。左侧大括号里写的是“要取谁”，不是“谁来接”。重命名和嵌套是高频刚需。
立即学习“Java免费学习笔记（深入）”；
- 基础形式：
const { name, age } = { name: 'Alice', age: 30 }; - 重命名：用
oldName: newName语法，const { title: bookName } = { title: 'JS Guide' };→ 变量名是bookName - 嵌套解构：用相同结构的嵌套大括号，
const { user: { profile: { avatar } } } = { user: { profile: { avatar: 'a.png' } } }; - 默认值：同样只在属性值为
undefined时触发，const { city = 'Beijing' } = { city: undefined };→city === 'Beijing'
常见错误：const { name } = null; 会立即抛 TypeError: Cannot destructure property 'name' of 'null'，因为 null 和 undefined 不可解构。安全做法是先做存在性判断，或用逻辑运算符兜底：const { name } = data || {};
函数参数中的解构：让 API 更清晰，但别滥用深层嵌套
函数形参支持完整解构语法，是提升接口可读性的利器，尤其适合配置对象。
function connect({ host = 'localhost', port = 3000, timeout = 5000 }) {
console.log(`Connecting to ${host}:${port} (timeout: ${timeout}ms)`);
}
connect({ host: 'api.example.com', port: 8080 }); // timeout 自动取默认值
- 可混合普通参数与解构参数：
function fn(a, { b, c }, d) { } - 支持默认值 + 重命名 + 嵌套，和变量解构规则完全一致
- 陷阱：过度嵌套会让调用方难以理解，比如
function draw({ canvas: { ctx: { fillStyle } } })—— 这类应拆成多层对象或改用 class 封装 - 性能无额外开销：解构发生在调用时，引擎已优化，不必担心“比手动取属性慢”
常见陷阱与边界情况
解构看着简单，但几个边界行为容易踩坑：
-
let { x } = { x: 1 }; let { x } = { x: 2 };会报错：重复声明x（let不允许重复声明），要用var或分开作用域 - 解构赋值语句不能以
{开头（会被解析为代码块），{ a, b } = obj;必须加括号：({ a, b } = obj); -
const [a, b, c] = 'xyz';合法 —— 字符串是可迭代的，a === 'x',b === 'y',c === 'z' -
const { length } = 'hello';也合法，length === 5，因为字符串有自有属性
最易忽略的一点：解构是浅层的。无论数组还是对象，它只解开第一层。嵌套对象里的属性不会自动递归解构，需要显式写出路径或配合其他工具（如 Lodash 的 get）。
