ECMAScript 2019:如何使用 Optional Chaining 特性避免繁琐的 null 值检查

在前端开发中,我们经常需要处理各种数据。在处理过程中,我们经常会遇到 null 值和 undefined 值。如果没有正确地处理这些值,就会抛出异常导致代码崩溃。在 ECMAScript 2019 中,添加了 Optional Chaining 特性,它可以帮助开发人员处理这些值,使代码更加简洁可读。

Optional Chaining 的作用

Optional Chaining 的作用是帮助开发人员处理可能包含 null 值或 undefined 值的表达式。当访问一个可能为空的对象属性或方法时,使用 Optional Chaining 特性可以安全地避免抛出 TypeError 异常。

Optional Chaining 的语法

使用 Optional Chaining 的语法非常简单,只需要在要访问的对象属性或方法后面加上问号(?)即可。例如:

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

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

如果 person、address 或 city 属性的值为 null 或 undefined,不会抛出异常,并返回 undefined。

Optional Chaining 示例

下面是一个使用 Optional Chaining 的示例。我们要从一个包含用户信息的对象数组中找到第一个用户名为“admin”的用户的邮箱地址。如果没有找到用户,或者邮箱地址为空,则打印一个错误信息。

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

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

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

总结

Optional Chaining 是一个非常方便的 ECMAScript 2019 特性,它可以避免繁琐的 null 值检查,使代码更加简洁可读。使用 Optional Chaining,我们可以更加安全和高效地处理可能为空的对象属性和方法。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/651cfac595b1f8cacd47ecfd


猜你喜欢

  • ES6 中的 BigInt 解决大数计算问题

    在前端开发中,经常会遇到需要进行大数计算的场景,这时候常规的 Number 类型往往无法胜任。ES6 中新增的 BigInt 类型就为我们解决了这一问题,本文将详细介绍 BigInt 的使用方法,以及...

    1 年前
  • 在 Sequelize 中使用 findById 方法查询记录时可能遇到的问题及解决方案

    在 Sequelize 中,我们经常需要使用 findById 方法来查询一条记录。虽然这个方法看似简单,但是在实际使用中,可能会遇到一些问题。本文将介绍这些问题,并给出相应的解决方案。

    1 年前
  • Node.js 如何实现 WebSocket 通信?

    什么是 WebSocket? WebSocket 是一种网络协议,它可在客户端和服务器之间建立双向持久连接,实现了客户端和服务器之间的实时通信。它与 HTTP 协议一样都是基于 TCP 协议实现的。

    1 年前
  • 《如何规范使用 BEM,结合 ESLint 检查 CSS 命名规范》

    前端开发中,CSS 作为网页排版与布局的重要语言,对命名规范的要求也越来越高。为了更好的防止命名冲突、提高可读性和可维护性,BEM 命名法逐渐成为了前端开发人员的首选。

    1 年前
  • 如何在 Socket.io 中实现自定义数据包的格式

    在 Socket.io 中,我们可以使用默认的数据传输格式,也可以自定义数据包格式来实现更加灵活的数据传输,满足特定需求。本文将介绍如何在 Socket.io 中实现自定义数据包的格式。

    1 年前
  • 基于 Mocha 测试框架的 Node.js 性能测试

    在现代前端开发中,性能测试是不可或缺的一环。通过性能测试,我们可以发现应用程序的瓶颈所在,及时优化代码,提高应用程序的质量和用户体验。Mocha 是一个流行的 JavaScript 测试框架,它可以帮...

    1 年前
  • RxJS 中的多播 (Multicasting):提供更好的性能和可维护性

    介绍 RxJS 是一种强大的 JavaScript 响应式编程库,它提供了一种基于观察者模式的抽象操作序列的方法。RxJS 中的操作符可以用于操作数据流来创建可复用和灵活的代码。

    1 年前
  • 「解决方案」解决 Flask 中的 CORS 问题

    在开发 Web 应用过程中,我们可能会遇到跨域资源共享 (CORS) 问题。在 Flask 中,我们可以使用 Flask-CORS 扩展库来解决这个问题。 什么是 CORS CORS 是一种 Web ...

    1 年前
  • 在 Deno 中使用 ESLint 进行代码检查

    Deno 是一款基于 JavaScript 和 TypeScript 的新一代运行时环境,具有高安全性和可维护性。在 Deno 中使用 ESLint 进行代码检查,可以帮助开发者在编写代码时及时发现潜...

    1 年前
  • ECMAScript 2019:解决 Object.fromEntries 在低版本浏览器中使用的问题

    在前端开发中,我们经常需要对对象进行操作。ECMAScript 2019 引入了新的方法 Object.fromEntries(),可以将键值对数组转换为对象。但是,在一些低版本的浏览器中,这个方法可...

    1 年前
  • 如何使用 Express.js 创建 HTTP 服务器?

    Express.js 是一款基于 Node.js 平台的第三方 Web 框架,它简化了 Web 应用的开发流程,提供了很多有用的功能,如路由器、中间件、错误处理等,并且可以轻松地创建 HTTP 服务器...

    1 年前
  • PM2 与 Redis 集成实现分布式架构

    前言 实现高可用、高并发、高性能的数字化系统需要使用分布式架构。而其中最重要的是多个服务器之间要实现数据同步。Redis 就是一个能实现数据同步的优秀方案之一。而 PM2 则是一个非常强大的进程管理器...

    1 年前
  • 从 koa1 到 koa2 升级指南

    从 Koa1 到 Koa2 升级指南 随着 Node.js 技术的不断发展,Koa 作为一款优秀的 Node.js 框架也不断更新迭代。本文将详细介绍如何从 Koa1 升级到 Koa2,帮助前端开发者...

    1 年前
  • AngularJS 的指令生命周期的解释和实例

    什么是AngularJS的指令生命周期? 在AngularJS中,指令是与HTML元素相关联的代码块,用于为网页添加行为和交互性。指令生命周期是指在指令创建、编译和销毁过程中所执行的操作和事件。

    1 年前
  • 解决 Fastify 框架中 Swagger API 文档的 404 报错

    解决 Fastify 框架中 Swagger API 文档的 404 报错 前言 在使用 Fastify 框架开发 API 的过程中,Swagger API 文档是一个非常有用的工具。

    1 年前
  • TypeScript 中的注解应用:在运行时提供元数据信息

    在前端开发中,我们经常需要通过注释来提供代码的文档和解释。但是注解(Annotation)是更进一步的工具,它们可以为代码提供额外的元数据信息。 在 TypeScript 中,注解是一种在编译时或运行...

    1 年前
  • 使用 Kubernetes HPA 作为自动扩展策略

    使用 Kubernetes HPA 作为自动扩展策略 当我们面对高流量压力时,如何使我们的应用程序始终能保持快速响应呢?在 Kubernetes 中,我们可以使用 HPA(Horizontal Pod...

    1 年前
  • Web Components 如何在微信小程序中使用

    随着前端技术的不断演进,Web Components 成为了一个备受关注的技术。Web Components 是一种由浏览器原生支持的前端组件化方式,它将属于组件自身的样式、行为和结构打包成一个独立的...

    1 年前
  • ES7 之 TypedArray 的 BigInt64Array 和 BigUint64Array 新特性详解

    ES7 为 TypedArray 带来了两个新的类型:BigInt64Array 和 BigUint64Array。这两个类型分别支持有符号的 64 位整数和无符号的 64 位整数。

    1 年前
  • Babel polyfill 导致项目运行缓慢问题的解决方案

    在使用Babel编译ES6及以上版本的JavaScript代码时,我们通常会使用Babel polyfill来为目标浏览器提供缺失的新语言特性。然而,使用Babel polyfill也可能导致项目运行...

    1 年前

相关推荐

    暂无文章