JavaScript解构赋值默认值仅对undefined生效,语法为变量名=默认值,支持表达式、嵌套及数组解构;null等falsy值不触发,默认值不适用于剩余元素,需结合??或展开运算符增强鲁棒性。

在 JavaScript 解构赋值中,可以通过在等号右侧的模式中直接为变量指定默认值,来防止 undefined 导致的意外行为。只要被解构的值是 undefined(注意:不是 null、false、0 或空字符串),默认值就会生效。
对象解构时设置默认值
适用于从对象中提取属性,且该属性可能不存在或为 undefined 的情况。
- 语法是在解构的变量名后加
=和默认值,例如:{ name = '匿名', age = 18 } = user - 默认值支持表达式,比如函数调用或三元运算:
{ timeout = getDefaultTimeout() } = config - 嵌套解构也能设默认值,但需注意层级结构是否真实存在,否则会报错;建议配合空值合并或可选链使用
数组解构时设置默认值
适用于从数组中按索引取值,尤其当数组长度不足时。
- 在对应位置写
变量名 = 默认值,例如:const [first, second = '无'] = arr - 跳过某些元素时仍可设默认值:
const [, , third = '默认第三项'] = arr - 剩余元素(
...rest)不能直接设默认值,但可以后续判断:const [a, b, ...rest] = arr; rest = rest.length ? rest : ['empty']
结合空值合并操作符(??)增强鲁棒性
解构默认值只对 undefined 有效,若想对 null 也生效,可先用 ?? 预处理。
立即学习“Java免费学习笔记(深入)”;
- 例如:
const { name } = user ?? {},再配合默认值更安全 - 或者一步到位:
const { name = '游客' } = { ...user }—— 利用展开避免undefined报错 - 实际项目中常组合使用:
const { id, title = '未命名' } = data ?? {}
常见误区提醒
默认值机制有边界,容易误用。
-
null不触发默认值,因为它是“存在”的值(falsy 但 not undefined) - 解构源为
null或undefined本身会直接报错,必须确保源是对象或数组(或先做兜底) - 函数参数解构中的默认值逻辑相同,但作用域和执行时机略有差异,需留意闭包行为


















