JavaScript 一直以来都是前端开发领域中最受欢迎的语言之一,在不断发展和改进中,ES9 为人们带来了一个非常有用的新功能 - 可选链运算符(Optional chaining operators)。在 ES9 之前,当我们需要访问一个复杂对象中的属性时,通常的方法是使用短路求值来避免未定义的变量引起的错误,例如:
if (obj && obj.prop1 && obj.prop1.prop2 && obj.prop1.prop2.prop3) { // do something }
但是,这种方式很难维护,代码变得繁琐和难以阅读。在这种情况下,可选链运算符就成了一个非常好的解决方案,它可以让我们更加简洁和优雅的访问和处理对象中的属性。
如何使用可选链运算符
在 ES9 中,?.
是可选链运算符的形式,可以在对象链中使用它。它的作用是防止在链中出现 undefined 或 null 的情况下,程序运行时抛出异常。
const result = object?.prop1?.prop2?.prop3;
上述代码就可以保证不会出现 undefined 和 null 引用,因为如果在这些属性之一上找不到任何结果,结果值将设置为 undefined。这种特性对于那些嵌套很深的对象来说非常有效,可以减少代码冗余和异常抛出的次数。
示例演示
让我们看一下如何在实际应用程序中使用可选链运算符。假设我们有一个包含许多学生的数组对象。每个学生都有一个身体属性数组,并且该数组包含一些事项和检查列表。使用 ES9 可选链运算符,我们可以轻松地访问,并处理学生的身体属性。
-- -------------------- ---- ------- ----- ------- - - ----- ----- ----- - ------- ---- ------- --- --------- ------------ ---------- ------- - -------------- - ---------- --- --------- --- -- ------------ - ------ ----- ----- --- - - - -- ----- --------- - ------------------------------------------------ ----- -------- - ----------------------------------------------- ----- ----------- - ------------------------------------------ ----------------------- - - ----------- -- -- ---------------------- - - ---------- -- --- ------------------------- - - ------------- -- ----
在上面的代码中,我们使用可选链运算符访问了 bloodPressure
和 temperature
对象,而不用检查对象在链中的层次结构是否存在 undefined 或 null 引用。
总结
ES9 的可选链运算符是 JavaScript 开发中的一个非常有用的工具,它可以避免代码中大量冗余并且易错的 if 语句,简化了对复杂对象的访问和处理。然而,我们也需要注意使用可选链运算符的场景,不应该过度使用,否则会影响代码可读性和维护性。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/645affd2968c7c53b0d5a89c