JavaScript结构赋值是直接从数组或对象提取值并赋变量的简洁语法。对象解构按属性名匹配（支持重命名、默认值、嵌套）；数组解构按索引顺序（支持跳过、剩余元素、默认值）；函数参数可直接解构；需注意声明必须用let/const/var，避免null/undefined报错。
JavaScript 中结构赋值（Destructuring Assignment）是一种从数组或对象中提取值并赋给变量的简洁语法，它可以直接在变量声明时完成解构和赋值，无需先获取整个数据再手动取值。
对象结构赋值：按属性名提取
当从对象中提取属性时，变量名需与属性名一致（或使用别名），括号外是声明语法，括号内是“模式”：
- 基础用法：const { name, age } = { name: "Alice", age: 30 }; → 声明并得到两个变量
name和age - 重命名：用
originalName: newName语法，例如 const { title: bookName } = { title: "JS Guide" }; → 变量名为bookName - 设置默认值：const { city = "Beijing" } = { }; → 若对象无
city属性，变量取默认值 - 嵌套解构：const { user: { id, profile: { email } } } = { user: { id: 123, profile: { email: "a@b.com" } } };
数组结构赋值：按位置提取
数组解构依据索引顺序，支持跳过、剩余元素收集和默认值：
- 基本提取：const [a, b] = [1, 2, 3]; →
a = 1,b = 2 - 跳过元素：用逗号占位，const [first, , third] = ["x", "y", "z"]; →
first = "x",third = "z" - 获取剩余项：const [head, ...tail] = [1, 2, 3, 4]; →
tail是数组[2, 3, 4] - 默认值：const [x = 10, y = 20] = [5]; →
x = 5,y = 20
函数参数中直接结构赋值
可在函数形参位置直接解构，让调用更清晰、逻辑更聚焦：
立即学习“Java免费学习笔记（深入）”；
- 对象参数：function print({ name, age = 18 }) { console.log(name, age); } → 调用
print({ name: "Bob" })输出"Bob 18" - 数组参数：function sum([a, b, c = 0]) { return a + b + c; } →
sum([1, 2])返回3 - 结合默认对象/数组：function init({ url = "/", method = "GET" } = {}) { ... } → 避免传入
undefined报错
注意点和常见陷阱
结构赋值虽简洁，但需留意语法限制和运行时行为：
- 声明时必须加
const/let/var；单独写{ a, b } = obj会报语法错误（被解析为代码块） - 若解构源为
null或undefined，会抛出 TypeError，建议配合默认值或可选链（?.）预处理 - 对象解构不检查属性是否为
undefined，只看是否存在该键；const { x } = { x: undefined }仍会赋值undefined - 嵌套解构失败时（如中间某层为
undefined），会报错，可用默认空对象缓解：const { user: { name } = {} } = data;
