Javascript即将迎来Optional Chaining

时间:2022-05-05
本文章向大家介绍Javascript即将迎来Optional Chaining,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
Optional Chaining 现在处于 Stage 1。

它是什么?

Optional Chaining 使我们能检查一个对象上面是否存在某属性。其它一些语言有类似的特性。C# 例如,有 Null Conditional 操作符很像提案中的 Optional Chaining。

我们为何需要它?

你是否曾经在使用对象或数组的属性之前,检查它是否存在吗?如果你不记得,下面展示一下:

if(specimen && specimen.arms && specimen.arms.length > 2)
    console.log("This is probably an alien");

如果我们不做检查,可能会遇到下面的错误:

因为,specimen 存在,但它没有 arms 属性。因此,当我们在它身上获取length属性时就会报错。

提案是怎样的?

取代上面的写法,我们可以使用 optional chaining 写出如下代码:

if(specimen?.arms?.length > 2)
    console.log("This is probably an alien");

不管怎样,我们应该记住 Optional Chaining 操作符是 ?. 而不是 ? ,这就意味着当我们从数组中获取数据时,应该如下:

var firstArm = specimen?.arms?.[0]; //CORRECT
var secondArm = specimen?.arms?[1]; //WRONG

相似的,当我们检查一个方法时,如下:

var kickPromise = specimen?.kick?.();  //CORRECT
var punchPromise = specimen?.punch?(); //WRONG

在上例中,在调用方法之前,我们先检查 kick 是否存在。

它是如何工作的?

这个操作符检查 ?. 左边的值是否为 null 或 undefined。如果是,这个表达式就终止然后返回 undefined。否则,这个表达式继续执行就像没有错误一样。