您能解释一下TypeScript 3.7可选链接吗？

Question

在TypeScript 3.7.2中，我可以使用“可选链接”。

requests?.requestsCount

您能解释一下它是如何工作的吗？

// before
requests ? requests.requestsCount : 0
// after
requests?.requestsCount || 0

我看到了代码的编译版本。

"use strict";
var _a;
return {
    requests: ((_a = requests) === null || _a === void 0 ? void 0 : _a.requestsCount) || 0
};

您能解释void 0吗？在release docs中，它应该是未定义的。

let x = (foo === null || foo === undefined) ? undefined : foo.bar.baz();

我可以安全地使用这种语法糖吗？

Answer 1

此编译代码

var _a;
return {
    requests: ((_a = requests) === null || _a === void 0 ? void 0 : _a.requestsCount)
};

执行以下操作

_a = requests
if _a === null || _a === undefined
    return {requests: undefined}
else
    return {requests: _a.requestsCount}

为什么void 0而不是undefined？因为名称undefined在javascript中没有保留，并且可以（至少在较旧的引擎中）被其他名称覆盖。 void 0或void whatever是获得undefined值的防弹方法。

为什么使用临时变量_a而不仅仅是requests？因为编译器必须确保参数仅被计算一次。想象一下：

someFunc()?.someProp

没有临时变量，它将调用someFunc 3次，这是不可接受的。同样，对于更长的链，例如x?.y?.z...，编译器将分配更多的临时变量_b，_c等。

我希望这能回答您的问题。