使用可选链运算符进行对象属性访问

Question

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

const value = a?.b?.c;

即，您可以使用此运算符访问对象的属性，其中对象本身可能是null或undefined。现在我想做的基本相同，但属性名称是动态的：

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

但是，我收到一个语法错误：

错误 TS1005: ':' 预期。

我在这里做错了什么？这甚至可能吗？

PS：提案似乎暗示这是不可能的（但也许我的语法示例错了）。

Answer 1

使用括号表示法和可选链接访问属性时，除了括号外，还需要使用点：

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

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

我的想法是：可选链接的符号不是?，而是?.。如果您在进行可选链接，您将始终使用这两个字符。

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

奖励：默认值

?? (Nullish Coalescing) 可用于在未定义或为空的情况下设置默认值。

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