使用可选链操作符访问对象属性

Question

TypeScript 3.7现在支持可选链操作符。因此，您可以编写以下代码：

const value = a?.b?.c;

也就是说，你可以使用这个操作符来访问一个对象的属性，即使这个对象本身可能是null或undefined。现在我想做的基本上是相同的，但是属性名称是动态的：

const value = a?[b]?.c;

然而，我遇到了一个语法错误：

错误 TS1005: 预期“:”。

我在这里做错了什么？这真的可能吗？

提案似乎暗示着这是不可能的（但也许我对语法示例理解有误）。

- Golo Roden

---

你没有理解重点，运算符是 ?.. - zessx

是的，当然，非常感谢。 - Golo Roden

我的旁注：TypeScript采用了先前的ES规范，因此我会链接MDN文档 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Optional_chaining - massic80

Answer 1

当使用方括号和可选链访问属性时，除了方括号外，还需要使用点号：

const value = a?.[b]?.c;

这是TC39提案采用的语法，否则解析器很难确定?是否属于三元表达式或可选链接的一部分。

我认为，可选链接符号不是?，而是?.。如果要使用可选链接，则必须同时使用这两个字符。

- Nicholas Tower

---

我会把“hard”替换为“不可能”。 - vol7ron

@vol7ron 为什么这样 - 我认为它可以期待 : - AnArrayOfFunctions

它无法区分，特别是当存在错误时。 - vol7ron

@AnArrayOfFunctions 不会发生。语言中已经有一些地方可以通过这种前瞻性来解决问题。想想语句 function(){}; 或 {a: 1}.a; 都是语法错误。此外：嵌套的三元运算符已经很难解析了（a?[...b][1]?c:d?.e:f 是什么意思）。最好不要通过重载 ? 来使它更加困难。 - Robert

哇，这真是超级不直观，因为去掉“可选”部分的可选链语法是无效的。你不能像a.[b].c那样运行链接，所以只有遇到问题并在网上搜索的人才会发现a?.[b]?.c。也许可以提出一个建议来启用a.[b].c链接语法？ - bsplosion

Answer 2

可选链操作符是?.

以下是一些用于处理可空属性和函数的示例。

const example = {a: ["first", {b:3}, false]}

// Properties
example?.a  // ["first", {b:3}, false]
example?.b  // undefined

// Dynamic properties ?.[]
example?.a?.[0]     // "first"
example?.a?.[1]?.a  // undefined
example?.a?.[1]?.b  // 3

// Functions ?.()
null?.()                // undefined
validFunction?.()       // result
(() => {return 1})?.()  // 1

奖励：默认值

??（空值合并）可用于在未定义或为空时设置默认值。

const notNull = possiblyNull ?? defaultValue
const alsoNotNull = a?.b?.c ?? possiblyNullFallback ?? defaultValue

- Gibolt

---

在执行 a?.b?.c ?? default 和 a?.b?.c || default 时有什么区别吗？ - nick

|| 检查所有假值（falsy values），因此 ''、0 和 false 都将使用默认值，而 ?? 仅在出现 null 和 undefined 时使用默认值。 - Gibolt

哦，好的，知道了！谢谢。 - nick

这是空值合并运算符 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing_operator - massic80