在 JavaScript 中，可通过 array[0]?.property 安全访问数组首个元素的属性，当数组为空或首元素为 null/undefined 时自动返回 undefined，避免运行时错误。
在 javascript 中，可通过 `array[0]?.property` 安全访问数组首个元素的属性，当数组为空或首元素为 `null`/`undefined` 时自动返回 `undefined`，避免运行时错误。
现代 JavaScript（ES2020 起）引入的可选链操作符（Optional Chaining, ?.）不仅适用于对象属性访问（如 obj?.prop），也完全支持数组索引访问和方法调用。这意味着你可以安全地写：
const arr = [{ foo: 'hello' }];
console.log(arr[0]?.foo); // "hello"
const emptyArr = [];
console.log(emptyArr[0]?.foo); // undefined
const nullFirst = [null, { foo: 'world' }];
console.log(nullFirst[0]?.foo); // undefined
✅ 关键特性：
- arr[0]?.foo 等价于 arr[0] == null ? undefined : arr[0].foo
- 若 arr 本身为 undefined 或 null，arr[0] 不会报错（因 ?. 短路），整体返回 undefined
- 支持深层链式访问：arr[0]?.nested?.value?.toString()
⚠️ 注意事项：
- 可选链仅对 null 和 undefined 短路，其他假值（如 0、false、''）仍会继续执行后续访问；
- 不支持在赋值左侧使用（如 arr[0]?.foo = 'new' 是语法错误）；
- 需确保运行环境支持 ES2020（现代浏览器、Node.js ≥ 14 默认支持；旧环境需 Babel 转译）。
? 替代方案对比（不推荐，仅作参考）：
// 冗长且易错
arr && arr[0] && arr[0].foo
// 依赖额外库（如 Lodash）
_.get(arr, '[0].foo')
// 使用空值合并（但无法阻止报错）
(arr[0] ?? {}).foo // ❌ 若 arr 为 undefined，arr[0] 仍抛出 TypeError
综上，arr[0]?.foo 是简洁、安全、标准化的最佳实践——它既语义清晰，又由语言原生保障健壮性。在处理 API 响应、表单数据或动态列表时，应优先采用此模式。
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
