可选链操作符(?.)解决访问嵌套对象属性时因 null 或 undefined 导致的运行时错误问题,避免冗长的防御性检查,支持属性访问、动态键、函数调用,并常与 ?? 结合提供默认值。

可选链操作符(?.)是 JavaScript 中用于安全访问嵌套对象属性的语法特性。它允许你在访问对象深层属性时,自动在遇到 null 或 undefined 时停止后续访问,并返回 undefined,而不是抛出错误。
可选链解决什么问题
在没有可选链之前,访问类似 user.profile.address.city 这样的嵌套属性时,如果中间某一层(比如 user、profile 或 address)是 null 或 undefined,JavaScript 就会立即报错:Cannot read property 'xxx' of undefined。开发者不得不写大量防御性检查:
const city = user && user.profile && user.profile.address && user.profile.address.city;
这种写法冗长且可读性差。可选链让这个过程变得简洁直接。
立即学习“Java免费学习笔记(深入)”;
基本用法:用 ?. 替代 .
只要在可能为 null 或 undefined 的属性前加上 ?.,就能启用安全访问:
-
user?.name→ 如果user是null或undefined,结果为undefined;否则取user.name -
user?.profile?.address?.city→ 任意一环为null/undefined,整个表达式返回undefined -
obj?.[key]→ 支持动态属性名的可选访问 -
func?.()→ 安全调用函数(仅当func是函数时才执行)
与空值合并操作符 ?? 配合使用
可选链常和空值合并操作符搭配,提供默认值:
const city = user?.profile?.address?.city ?? 'Unknown';
这样既避免了报错,又保证了变量总有可用值,逻辑更健壮。
注意事项和限制
可选链只对左侧值为 null 或 undefined 时生效,其他假值(如 0、false、'')不会中断链式访问。
它不能用于赋值操作左侧,例如 user?.name = 'Alice' 是语法错误。
不支持在非对象类型上使用方法调用(如 str?.toUpperCase() 在 str 为 undefined 时没问题,但若 str 是数字则会报错,因为数字没有 toUpperCase 方法)。










