可选的链式调用目前在第1阶段,您需要的所有信息在这个仓库里。
它是什么?
可选的链式调用允许我们检查对象是否存在,然后尝试访问它的属性。其他一些语言也有相似之处。例如,c#有一个空条件操作符,它的行为非常类似于所提议的可选的链式调用。
我们为什么需要它?
您是否曾经在访问其属性之前检查过对象或数组的存在?如果你忘了,我帮你回忆一下像下面这样:
if(specimen && specimen.arms && specimen.arms.length > 2)
console.log("This is probably an alien");
我们做这些检查的原因是因为在javascript中允许匿名对象它不一定具有我们访问的结构,因此,如果我们不检查对象树中的父项,我们可能会有很多像这样的错误:
因为,起码在这个错误中specimen
确实存在,但它没有arms
属性,因此,我们试图得到undefined
的length
。
所以,有更好的方式吗?
我们可以使用可选的链式调用,像下面这样:
if(specimen?.arms?.length > 2)
console.log("This is probably an alien");
这里请记住哈可选的链式调用使用的是?.
而不是?
,这意味着当使用它访问数组中的项时它看起来像这样:
var firstArm = specimen?.arms?.[0]; // 正确
var secondArm = specimen?.arms?[1]; // 错误
同样,当使用它来检查函数的存在时:
var kickPromise = specimen?.kick?.(); // 正确
var punchPromise = specimen?.punch?(); // 错误
在这种情况下,我们在将它作为函数调用之前检查kick
是否存在!
它是如何工作的呢?
?.
操作符检查左边的是什么,是null
或undefined
。如果是,则表达式短路返回undefined
。否则,表达式就会继续计算,就好像没有任何错误。
什么时候可以使用它?
那么,它目前仍然是一个提议(proposal),所以它现在还不在Vanilla JavaScript中。但是,它可以与Babel一起使用!
为了跟上提案的进度,以及有一个更深入的了解和检查一些例子,如果你喜欢应该查看他们的GitHub repo!
谢谢阅读