TypeScript 4.1 扩展了 TypeScript 3.7 的支持:带问号的链操作符和 nullish 合并

TypeScript 4.1 是 TypeScript 的一个新版本,它扩展了 TypeScript 3.7 的支持,增加了两个新的特性:带问号的链操作符和 nullish 合并。这两个特性都是为了更好地处理可选值和空值而设计的。

带问号的链操作符

带问号的链操作符是 TypeScript 3.7 中引入的一个新特性。它可以让你更方便地访问对象的属性和方法,而不用担心对象不存在或者属性不存在的情况。

在 TypeScript 4.1 中,带问号的链操作符得到了扩展。现在,你可以在链操作符中使用函数调用,而不仅仅是属性访问。这个新特性可以让你更方便地处理函数返回的可选值。

下面是一个示例代码:

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

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

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

在这个示例代码中,我们定义了一个 Person 接口,它有三个可选属性:nameagesayHello。我们定义了一个 printPerson 函数,它接受一个可选的 Person 对象作为参数,并打印出 name 的大写形式、age 的值和调用 sayHello 方法。

printPerson 函数中,我们使用了带问号的链操作符来访问 person 对象的属性和方法。如果 person 对象不存在,或者 namesayHello 属性不存在,链操作符会返回 undefined。如果 age 属性不存在,我们使用了 nullish 合并操作符 ?? 来返回默认值 0

nullish 合并

nullish 合并是 TypeScript 4.0 中引入的一个新特性。它可以让你更方便地处理空值或者 undefined 值。

在 TypeScript 4.1 中,nullish 合并得到了扩展。现在,你可以在 nullish 合并中使用函数调用,而不仅仅是属性访问。这个新特性可以让你更方便地处理函数返回的空值或者 undefined 值。

下面是一个示例代码:

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

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

在这个示例代码中,我们定义了一个 getPersonName 函数,它接受一个可选的 person 对象作为参数,并返回 person.name 的值,如果 person 对象不存在或者 name 属性不存在,返回默认值 'Unknown'

getPersonName 函数中,我们使用了带问号的链操作符来访问 person 对象的 name 属性。如果 person 对象不存在,或者 name 属性不存在,链操作符会返回 undefined。如果返回值是 undefined,我们使用了 nullish 合并操作符 ?? 来返回默认值 'Unknown'

总结

TypeScript 4.1 扩展了 TypeScript 3.7 的支持,增加了带问号的链操作符和 nullish 合并。这两个特性都是为了更好地处理可选值和空值而设计的。带问号的链操作符可以让你更方便地访问对象的属性和方法,而不用担心对象不存在或者属性不存在的情况。nullish 合并可以让你更方便地处理空值或者 undefined 值。这两个特性都可以让你更方便地编写类型安全的代码。

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


猜你喜欢

  • Tailwind CSS 与 Material UI 的对比,如何选择更适合你的 UI 库

    Tailwind CSS 与 Material UI 的对比:如何选择更适合你的 UI 库? 在前端开发中,UI 库是不可或缺的。UI 库可以大大降低前端开发的难度,提高开发效率。

    3 个月前
  • 使用 Mocha + Jasmine + Karma + Webpack 测试 javascript 代码

    使用 Mocha + Jasmine + Karma + Webpack 测试 JavaScript 代码 在前端开发中,测试是一个非常重要的环节。好的测试可以保证代码的质量,减少出错的可能性,提高开...

    3 个月前
  • 如何使用 Chai 和 Jasmine 进行 JavaScript 代码测试?

    在前端开发中,测试是非常重要的一环。测试可以帮助我们发现代码中的问题,确保代码质量,减少错误和缺陷。本文将介绍如何使用 Chai 和 Jasmine 进行 JavaScript 代码测试。

    3 个月前
  • 盘点全球最佳 PWA 应用

    随着移动设备的普及,越来越多的网站和应用开始采用 PWA(Progressive Web App)技术,它可以让网站和应用更像原生应用一样运行,提供更好的用户体验。

    3 个月前
  • 从 RESTful API 版本管理工具 Swagger 中学习 API 文档的撰写

    从 Swagger 中学习 RESTful API 文档的撰写 RESTful API 是现代 web 应用程序开发中的核心概念之一。API 文档是开发者了解如何使用 API 的重要资源。

    3 个月前
  • Koa2 之 oauth2.0 的全面实践

    前言 在现代 web 应用中,用户认证和授权是一个非常重要的问题。OAuth2.0 是一个流行的协议,用于在不暴露用户密码的情况下授权第三方应用程序访问用户资源。本文将介绍如何使用 Koa2 和 OA...

    3 个月前
  • Docker 探索:Docker 原理详解

    前言 在前端开发中,我们常常需要配置各种环境来满足我们的开发需求,例如 Node.js、Nginx、MySQL 等,但是在不同的机器上配置环境时,经常会出现各种问题,例如版本不一致、依赖包冲突等等。

    3 个月前
  • Fastify 如何集成 GraphQL,以及 GraphQL 的优势与劣势

    Fastify 如何集成 GraphQL 什么是 GraphQL GraphQL 是一种用于 API 的查询语言,它提供了一种更高效、更强大、更灵活的方式来定义、查询和传递数据。

    3 个月前
  • Mongoose 中使用 mongoose-delete 进行软删除的方法及应用实例

    在实际开发中,我们经常需要对数据进行删除操作。但是有些情况下,我们并不希望数据真正的被删除,而是希望将其标记为已删除状态,以便于日后进行恢复或者归档。这就是软删除。

    3 个月前
  • 如何在 Jest 中使用 jest-cucumber 进行 BDD 测试

    BDD(Behavior-driven development,行为驱动开发)是一种敏捷软件开发方法,它强调软件开发应该关注于软件的行为而非其实现细节。在 BDD 中,开发人员和业务人员会共同定义软件...

    3 个月前
  • ESLint 与 Babel:如何处理 ES6 语法

    在前端开发中,ES6 已经成为了主流的语言规范。但是,并不是所有的浏览器都能够完美地支持 ES6 语法,因此我们需要使用一些工具来将 ES6 转换成浏览器能够识别的语法。

    3 个月前
  • Jest Runner Error:No Tests Found 的解决方案

    Jest 是一款流行的 JavaScript 测试框架,它提供了强大的测试工具和丰富的断言库,使得前端开发人员能够轻松地编写和运行测试。然而,在使用 Jest 进行测试时,有时候会遇到 “No Tes...

    3 个月前
  • Babel 中的 async/await 问题及解决方法

    在现代 JavaScript 中,异步编程已经成为了必不可少的一部分。而 async/await 是一种更加简洁、易读和易写的异步编程方式,它能够让我们更加轻松地编写异步代码,并且避免了 JavaSc...

    3 个月前
  • 使用 Deno 实现 JavaScript 加密

    在前端开发中,加密是一个重要的安全问题。加密可以保护用户的敏感信息,防止信息泄露和被黑客攻击。在 JavaScript 中,加密通常使用第三方库,例如 CryptoJS 和 Node.js 的 cry...

    3 个月前
  • 使用 Angular 编写单元测试时的常见问题和解决方法

    前言 单元测试是前端开发过程中不可或缺的一部分,它可以保证代码的质量和稳定性,同时也可以提高开发效率。在 Angular 中,单元测试是非常重要的,因为它可以帮助我们验证组件、指令、服务等的正确性。

    3 个月前
  • 详解 CSS Flexbox 布局常见问题及解决方法

    在前端开发中,CSS Flexbox 布局已经成为了一种非常流行的布局方式。它可以方便地实现各种复杂布局,而且在响应式布局中也有着很好的表现。但是,在实际开发中,我们也会遇到一些问题,本文将详细介绍 ...

    3 个月前
  • Mongoose 中 find 方法查询结果的类型及应用实例

    在 Node.js 中,Mongoose 是一个非常流行的 MongoDB 驱动程序,它提供了一种更加简单和直观的方式来操作 MongoDB 数据库。其中,find 方法是 Mongoose 中最常用...

    3 个月前
  • 如何使用 ES9 中的 Promise.finally 来优化代码?

    Promise.finally 是 ES9 新增的一个方法,它可以在 Promise 完成或被拒绝后执行一些操作,不管 Promise 的状态如何都会执行。这个方法的作用在于,无论 Promise 的...

    3 个月前
  • Cypress 中如何进行 UI 自动化测试并生成报告

    前言 在前端开发中,UI 自动化测试是非常重要的一环。它可以帮助我们快速发现代码中的问题,提高代码的质量和稳定性。而 Cypress 是一款功能强大的前端自动化测试工具,它能够轻松地进行 UI 自动化...

    3 个月前
  • RESTful API 设计中常见的安全问题及解决方案

    RESTful API 是一种设计风格,用于构建 Web 服务,它使用 HTTP 协议的各种方法来访问和操作资源。在设计 RESTful API 时,安全是非常重要的一部分。

    3 个月前

相关推荐

    暂无文章