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

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) 可用于在未定义或 null 时设置默认值。

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