JavaScript 中 null 在解构赋值中的默认值表现逻辑

解构赋值默认值仅对 undefined 生效，null 被视为有效值不触发默认值；如 {x = 10} = {x: null} 得 x 为 null，而 {x = 10} = {} 或 {x: undefined} 才得 x 为 10。

在 JavaScript 解构赋值中，null 不会触发默认值，它会被当作一个“有效值”直接解构，导致报错或得到 null 本身 —— 这和 undefined 的行为完全不同。

为什么 null 不触发默认值？

解构赋值的默认值只在被解构的值是 undefined 时生效。而 null 是一个原始的、合法的值（类型为 'object'，但语义上表示“空值”），JS 引擎不会把它视为空缺，因此跳过默认值逻辑。

• const { x = 10 } = { x: null }; → x 是 null，不是 10
• const { x = 10 } = { }; → x 是 10（因为 x 属性不存在，取值为 undefined）
• const { x = 10 } = { x: undefined }; → x 是 10

常见陷阱：误以为 null 算“空”

开发者常期望 null 和 undefined 在解构中表现一致，但实际并非如此。比如从 API 获取数据时，后端可能返回 {"user": null}，若直接解构：

• const { user: { name } = {} } = data; → 报错：Cannot destructure property 'name' of 'undefined'（因为 user 是 null，null.name 是 undefined，再解构就崩了）
• 正确写法需先确保 user 是对象：const { user = {} } = data; const { name } = user;

安全解构 null 的几种方式

想让 null 也走默认逻辑，得手动干预：

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

• 用空值合并操作符（??）预处理：const { name } = (data.user ?? {}) || {};
• 解构前做类型判断：const user = data.user == null ? {} : data.user; const { name } = user;
• 用可选链 + ?? 组合：const name = data.user?.name ?? 'anonymous';（适用于取单个属性）
• 函数封装默认逻辑：const safeObj = (val) => val == null ? {} : val;，再 const { x } = safeObj(data.obj);

数组解构中的 null 表现类似

数组解构同样不把 null 当作“空位”：

• const [a = 1] = [null]; → a 是 null
• const [a = 1] = []; → a 是 1
• 若想对 null 元素设默认值，需先映射：const [a] = arr.map(x => x ?? 1);

不复杂但容易忽略。记住：解构默认值只认 undefined，null 是实打实的“有值”，要它听话，得自己先清理一遍。