JavaScript解构赋值是从数组或对象中提取值并赋给变量的简洁语法，支持重命名、默认值、嵌套解构、数组按位置提取、跳过元素、剩余运算符、函数参数自动解构及与rest/spread组合使用。
JavaScript 解构赋值是一种从数组或对象中提取值并赋给变量的简洁语法，它能大幅减少冗余代码，让逻辑更清晰、可读性更强。
快速提取对象属性
传统方式需要逐个访问属性再赋值，解构则一步到位：
说明：只需在等号左边用与目标对象结构相同的“模式”声明变量名，JS 自动匹配赋值。
- 基础用法：
const { name, age } = user;等价于const name = user.name; const age = user.age; - 重命名属性：
const { name: fullName, age: years } = user;提取时直接改名 - 设置默认值：
const { city = 'Beijing', level = 1 } = user;属性不存在时启用默认 - 嵌套解构：
const { profile: { avatar, bio } } = user;一层写完深层路径
高效处理数组元素
按位置提取数组项，跳过不需要的元素，甚至交换变量也不用临时变量：
立即学习“Java免费学习笔记（深入）”；
Comprehensive Three.js 3D graphics reference
下载
详细的 Three.js 3D 图形参考，涵盖场景设置、相机、几何体、材质、光照、动画、控制器、加载器、数学工具和调试。
说明：方括号内对应索引顺序，空位表示跳过，剩余运算符（...）收集其余项。
- 基础提取：
const [first, second] = ['a', 'b', 'c'];→first === 'a',second === 'b' - 跳过中间项：
const [a, , c] = ['x', 'y', 'z'];→a === 'x',c === 'z' - 获取剩余元素：
const [head, ...tail] = [1, 2, 3, 4];→tail是[2, 3, 4] - 快速交换：
[a, b] = [b, a];一行完成，无需临时变量
函数参数自动解构
把解构用在函数形参上，让调用更语义化，也避免手动解析传入的对象或数组：
- 对象参数解构：
function greet({ name, greeting = 'Hello' }) { return `${greeting}, ${name}!`; }
调用：greet({ name: 'Alice' })→"Hello, Alice!" - 数组参数解构：
function sum([a, b]) { return a + b; }
调用：sum([3, 5])→8 - 混合使用：
function draw({ x, y }, [width, height]) { /* ... */ }
配合 rest/spread 和默认值提升健壮性
解构不是孤立语法，和扩展运算符、默认值组合后，能优雅应对不确定结构的数据：
- 安全提取 API 响应：
const { data = {}, error = null } = response || {}; - 合并配置：
const config = { timeout: 5000, ...customConfig };再用解构读取：const { timeout, retries = 3 } = config; - 函数返回多值处理：
const [err, result] = await doAsync();—— 类似 Go 风格错误处理
不复杂但容易忽略。用对了，代码会更轻、更稳、更容易维护。
