JavaScript可选链(?.)用于安全访问嵌套属性、方法或数组元素,遇null/undefined立即返回undefined而不报错;支持属性访问、函数调用、数组索引三种形式,并可与??配合提供默认值,但不可用于赋值。

JavaScript 可选链(Optional Chaining)是一种安全访问嵌套对象属性的语法,它允许你在访问深层属性、方法或数组元素时,自动处理中间环节可能为 null 或 undefined 的情况,避免运行时报错。
可选链的基本写法:用 ?. 替代 .
传统方式访问嵌套属性容易报错:
const name = user.profile.name; // 如果 user 或 profile 是 undefined,会抛出 TypeError使用可选链后:
const name = user?.profile?.name; // 若 user 或 profile 为 null/undefined,直接返回 undefined,不报错它不会“跳过”整个表达式,而是从第一个为 null 或 undefined 的左侧值开始,立即返回 undefined,后续不再执行。
立即学习“Java免费学习笔记(深入)”;
支持的三种可选链操作形式
-
属性访问:
obj?.prop或obj?.['prop'] -
函数调用:
obj?.method()—— 如果method不存在或为undefined,不调用,返回undefined -
数组索引访问:
arr?.[index]—— 若arr无效,不取值,返回undefined
配合空值合并运算符 ?? 提供默认值
可选链本身返回 undefined,但你往往需要一个兜底值。这时可以和空值合并运算符搭配:
注意:?? 只在左侧为 null 或 undefined 时生效,不会被 false、0、'' 触发,比 || 更精准。
不能单独使用的场景(常见误区)
可选链必须出现在“安全访问”的上下文中,不能用于赋值或声明:
- ❌
user?.profile = {}—— 语法错误,不可赋值 - ❌
let name = user?.profile?.name;—— 这句本身合法,但若想给user?.profile赋新值,仍需先确保user存在 - ✅ 正确做法是:先检查再赋值,或用逻辑判断 + 解构默认值











