可选链操作符?.是安全访问嵌套对象属性的语法，遇null/undefined时返回undefined而非报错；常与??连用提供默认值，不支持原始类型和赋值操作，兼容性需注意。
可选链操作符 ?. 是什么
它是一种安全访问嵌套对象属性的语法，当访问路径中任意一层为 null 或 undefined 时，不抛出错误，而是直接返回 undefined。
比如：user?.profile?.avatar?.url 不会因 user 为空而报 Cannot read property 'profile' of null，而是安静地返回 undefined。
什么时候必须用 ?. 而不是普通点号
当你不确定某个中间对象是否存在，又不想写一长串 && 判断时，?. 就是更简洁、更可读的替代方案。
- 常见场景：API 响应数据结构不稳定（如后端字段可能缺失）、表单字段动态生成、组件 props 未完全初始化
- 不能用于非对象类型：对原始值（如
string、number）使用?.会静默失败（返回undefined），但不会报错 —— 这既是优点也是陷阱 -
?.后面只能跟属性名、括号调用()或方括号[]，不能跟赋值或递增操作（如obj?.count++语法错误）
?. 和空值合并操作符 ?? 经常一起用
单独用 ?. 返回 undefined，往往需要兜底值 —— 这时候接一个 ?? 就很自然：
立即学习“Java免费学习笔记（深入）”；
const name = user?.profile?.name ?? 'Anonymous';
注意别和逻辑或 || 混用：user?.age || 0 在 age === 0 时也会 fallback，而 user?.age ?? 0 只在 undefined 或 null 时生效。
浏览器兼容性需留意：IE 完全不支持，现代 Chrome/Firefox/Edge（≥80）和 Node.js（≥14.0.0）支持良好；若需兼容旧环境，得靠 Babel 转译。
容易被忽略的边界情况
可选链只保护「访问过程」，不保护「后续操作」：
-
arr?.[index]?.toString()：如果arr存在但arr[index]是undefined，?.阻止了报错；但如果arr[index]是null，.toString()仍会触发TypeError（因为null没有该方法） -
obj?.method?.()：第一个?.保证method存在，第二个?.保证它是函数才调用；但如果method是普通属性（比如字符串），?.不会阻止TypeError: not a function - 它不能跳过
undefined的数组索引：list?.[5]?.id中，若list是[1,2,3]，list[5]本就是undefined，?.正常生效；但若list是null，才真正体现它的价值
真正难处理的，往往是“对象存在但内部结构意外为 null”这种半空状态 —— ?. 解决不了所有问题，它只是让错误更可控，而不是彻底消除判断需求。
