TypeScript 4.5 发布，带来 Promise 功能改进

原創

2021-11-19 11:23

{"type":"doc","content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"11 月 17 日，微软发布 "},{"type":"link","attrs":{"href":"https:\/\/www.typescriptlang.org\/","title":"xxx","type":null},"content":[{"type":"text","text":"TypeScript"}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 4.5 正式版本，本次更新，带来大幅功能更新和性能改进，包括引入 Awaited 类型和 Promise 改进，用于增强异步编程、引入 es2022 模块、支持 Import 断言等。具体更新内容如下："}]},{"type":"heading","attrs":{"align":null,"level":3},"content":[{"type":"text","text":"Awaited 类型与 Promise 改进"}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" "}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"在此前的版本中，要获取 Promise 的返回类型，必须使用 infer 功能，如下所示："}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"codeblock","attrs":{"lang":"typescript"},"content":[{"type":"text","text":"type Unwrap = T extends PromiseLike ? U : T;\nconst resultPromise = Promise.resolve(true);\n\/\/ resultUnwrapType is boolean \ntype resultUnwrapType = Unwrap;"}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" "}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"TypeScript 4.5 引入了一种新的实用程序类型： "},{"type":"codeinline","content":[{"type":"text","text":"Awaited"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 类型，你不需要像上面的 Unwarp 那样自定义映射类型，举例如下："}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"codeblock","attrs":{"lang":"typescript"},"content":[{"type":"text","text":"type resultUnwrapType = Awaited;"}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" "}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"该工具还有以下功能："}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" "}]},{"type":"bulletedlist","content":[{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"递归解包"}]}]},{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"不依赖 "},{"type":"codeinline","content":[{"type":"text","text":"PromiseLike"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 更稳健"}]}]},{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"利用 "},{"type":"codeinline","content":[{"type":"text","text":"Awaited"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" ，为 "},{"type":"codeinline","content":[{"type":"text","text":"Promise.all"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 、 "},{"type":"codeinline","content":[{"type":"text","text":"Promise.race"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 、 "},{"type":"codeinline","content":[{"type":"text","text":"Promise.allSettled"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 和 "},{"type":"codeinline","content":[{"type":"text","text":"Promise.any"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 增加重载"}]}]}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" "}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"下面看一些不同的用例"}]},{"type":"codeblock","attrs":{"lang":"typescript"},"content":[{"type":"text","text":"\/\/ type is string\ntype basic = Awaited>;\n\/\/ type is string\ntype recursive = Awaited>>;\n\/\/ type is boolean\ntype nonThenObj = Awaited;\n\/\/ type is string | Date\ntype unions = Awaited>>;\ntype FakePromise = { then: () => string };\n\/\/ type is never\ntype fake = Awaited;"}]},{"type":"heading","attrs":{"align":null,"level":3},"content":[{"type":"text","text":"在 Nightly 版本支持 Node.js 运行 ECMAScript 模块"}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" "}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"link","attrs":{"href":"https:\/\/nodejs.org\/zh-cn\/","title":"xxx","type":null},"content":[{"type":"text","text":"Node.js"}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 的模块基础一直是 CommonJS，随着多态应用的转变，支持 ECMAScript 模块的要求也越来越高。过去几年时间里，Node.js 一直在努力支持运行 "},{"type":"link","attrs":{"href":"https:\/\/zh.wikipedia.org\/zh-hans\/ECMAScript","title":"xxx","type":null},"content":[{"type":"text","text":"ECMAScript"}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 模块。从 Node.js 12 版本开始，对 ES 模块的支持就很广泛了。"}]},{"type":"heading","attrs":{"align":null,"level":4},"content":[{"type":"text","text":"ES 模块带来了什么"}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" "}]},{"type":"bulletedlist","content":[{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"使用 "},{"type":"codeinline","content":[{"type":"text","text":"import\/export"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 语句语法"}]}]},{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"顶级 await 可与 "},{"type":"codeinline","content":[{"type":"text","text":"nodenext"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 一起使用"}]}]},{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"因为现在有不同的模块策略 ES 模块相对导入需要完整的文件扩展名： "},{"type":"codeinline","content":[{"type":"text","text":"import fade from .\/utils.js"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]}]}]},{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"一些全局关键字，如 "},{"type":"codeinline","content":[{"type":"text","text":"require"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 在 ES 模块上不起作用"}]}]},{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"CommonJS 将转译 ES 特性，如 "},{"type":"codeinline","content":[{"type":"text","text":"import\/export"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 语法"}]}]}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" "}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}},{"type":"strong"}],"text":"目前该功能仅在 TypeScript Nightly 版本中可用。"}]},{"type":"heading","attrs":{"align":null,"level":3},"content":[{"type":"text","text":"node_modules 支持 lib"}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" "}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"为了确保 TypeScript 和 JavaScript 能够开箱即用，TypeScript 捆绑了一系列声明文件(.d .ts文件)。这些声明文件表示 JavaScript 语言中可用的 API 和标准的浏览器 DOM API。虽然根据文件目标有一些合理的默认值，但你可以通过在tsconfig.json 中配置 lib 设置，来挑选程序使用哪些声明文件。"}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" "}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"TypeScript 4.5 引入了一种覆盖特定内置库的方法，类似于 @types\/support 的工作方式。在决定 TypeScript 应该包含哪些 lib 文件时，它首先会在 "},{"type":"codeinline","content":[{"type":"text","text":"node_modules"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 中寻找一个有作用域的 @typescript\/lib-* 包。例如，当在 lib 中包含 dom 选项时，TypeScript 会使用 "},{"type":"codeinline","content":[{"type":"text","text":"node_modules\/@typescript\/lib-dom"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 中的类型。"}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" "}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"然后可以安装一个特定的包来接管给定的库。例如，现在 TypeScript 在 @types\/web 上发布 DOM API 版本。如果你想锁定你的项目到一个特定版本的 DOM API，可以添加这个到你的 package.json："}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" "}]},{"type":"codeblock","attrs":{"lang":"typescript"},"content":[{"type":"text","text":"{\n \"dependencies\": {\n \"@typescript\/lib-dom\": \"npm:@types\/web\"\n }\n}"}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"从 TypeScript 4.5 开始，依赖管理器的锁文件（lockfile）会确保使用的 DOM 类型的版本完全相同。"}]},{"type":"heading","attrs":{"align":null,"level":3},"content":[{"type":"text","text":"其他新特性："}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" "}]},{"type":"bulletedlist","content":[{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"引入 es2022 模块：TypeScript 现在支持一个新的模块设置：es2022。es2022 模块的主要功能是顶层 await，意味着开发者可以在 async 函数之外使用 await。这在模块 esnext（以及现在的模块 nodenext）中已经得到支持，但 es2022 是这个功能的第一个稳定目标。"}]}]},{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"模板字符串可以用作判断符：TypeScript 4.5 现在可以缩小具有模板字符串类型的值，并且还将模板字符串类型识别为判别式。"}]}]},{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"新的代码段补全：TypeScript 4.5 带来了两个新的代码段补全，这些补全添加了一些默认文本，并允许开发人员可能通过标签查看想要调整的代码片段。"}]}]},{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"支持 import 断言：TypeScript 4.5 支持 ECMAScript 关于导入断言的提议，这是运行时使用的一种语法，以确保导入有一个预期的格式。"}]}]},{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"私有字段检查：开发人员现在可以编写一个具有 #private 字段成员的类，并使用 in 运算符查看另一个对象是否具有相同的字段，以用于检查对象上是否具有私有字段。"}]}]},{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"JSDoc 中的常量断言和默认类型参数"}]}]},{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"更快的加载时间：对所有系统的 Node.js 引入 "},{"type":"codeinline","content":[{"type":"text","text":"realpathSync.native"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 函数，减少项目加载时间（Windows 少了 5-13%）。"}]}]},{"type":"listitem","attrs":{"listStyle":null},"content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"更好的编辑器支持：对未解析的类型会直接展示原名（之前版本是用 "},{"type":"codeinline","content":[{"type":"text","text":"any"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]},{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" 来代替未解析的类型）"}]}]}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" "}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":"参考链接："}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}],"text":" "}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"link","attrs":{"href":"https:\/\/devblogs.microsoft.com\/typescript\/announcing-typescript-4-5\/","title":null,"type":null},"content":[{"type":"text","text":"https:\/\/devblogs.microsoft.com\/typescript\/announcing-typescript-4-5\/"}],"marks":[{"type":"color","attrs":{"color":"#494949","name":"user"}}]}]}]}