ES9 的对象扩展之 Optional Chaining

ES9(ECMAScript 2018)是 JavaScript 语言的一个版本,在 ES9 中引入了一项名为“Optional Chaining”的新特性。这是一项非常有用的对象扩展功能,能够更加安全地读取代码中的嵌套对象属性和方法。

Optional Chaining 的用途

在 JavaScript 中,我们经常需要读取和展示嵌套对象属性的值。例如,我们可能会写出以下代码:

-- ------- -- ----------- -- ------------------ -
  -------------------------------
-

上面的代码会检查 person 对象是否存在,并检查 name 属性是否存在,并检查 first 属性是否存在。只有当这些属性都存在时,我们才能安全地访问 person.name.first 值。

这种处理嵌套数据的方式非常麻烦,也容易出错。Optional Chaining 就是为了解决这个问题而引入的。

Optional Chaining 的语法

Optional Chaining 语法使用问号(?)来指示属性是否存在。如果属性不存在,JavaScript 引擎会立即返回 undefined 值,而不会导致错误。

下面是一个简单的例子:

---------------------------------

在上面的代码中,我们使用 ? 符号指示了 personnamefirst 属性是否存在。如果任何一个属性不存在,JavaScript 引擎都会返回 undefined 值。

这种语法非常方便,尤其是处理嵌套数据结构时,可以大大简化代码的复杂度。

Optional Chaining 的深度嵌套

Optional Chaining 不仅可以处理简单的属性访问,还可以处理多个嵌套属性的访问。

---------------------------------------------

在上面的代码中,我们使用 Optional Chaining 来访问 person.address.city.postcode 属性。如果 personaddresscity 属性不存在,JavaScript 引擎都会返回 undefined 值。

Optional Chaining 与函数调用

Optional Chaining 还可以与函数调用一起使用,可以避免在调用某个方法之前检查函数或方法是否存在。

---------------------------------

在上面的代码中,我们使用 Optional Chaining 来调用 person.getName() 方法。如果 person 对象不存在或 getName 方法不存在,JavaScript 引擎都会返回 undefined 值。

示例代码

下面是一些示例代码,展示如何使用 Optional Chaining 处理嵌套数据结构。

----- ------ - -
  ----- -
    ------ -------
    ----- -----
  --
  -------- -
    ----- ---- ------
    --------- -------
  --
  ------------- -
    ------ ----------------------- -----------------------
  -
--

--------------------------------- -- ------
--------------------------------------- -- -------
--------------------------------- -- ---------
------------------------------------- -- ----- ----

上面的代码演示了如何使用 Optional Chaining 处理嵌套数据结构,并且在调用函数时避免出现问题。

结论

使用 Optional Chaining 是一种更安全、更简单的处理嵌套数据结构的方式。它可以大大减少代码复杂度,并减少出现错误的可能性。如果你在处理嵌套数据结构时使用 Optional Chaining,可以提高代码的健壮性和可读性。

来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/6723718c2e7021665e100db2