TypeScript 中使用 async/await 的指南
随着 JavaScript 语言越来越流行，异步编程也成为了大家编写 JavaScript 代码时必须面对的问题。而异步编程中最常用的就是 Promise 和 async/await。而 TypeScript 在此方面也有其特定的使用技巧。
本篇文章将会介绍 TypeScript 中使用 async/await 的指南。我们将会讨论以下内容：
async/await 简介
如何使用 async/await
TypeScript 中的 async/await
示例代码与实例演练
总结与回顾
async/await 简介
async/await 是 ES7 的一个特性，可以让异步操作更简单易懂。async 关键字修饰的函数返回的是一个 Promise 对象，而其中的 await 关键字表示需要等待其后的 Promise 语句执行完毕后再继续执行。
这样写代码能够减少我们的嵌套层数，提高代码的可读性。而且 async/await 内部自动捕获错误，避免了手动 try/catch 的糟糕代码组织。
- 如何使用 async/await
在使用 async/await 时，需要注意以下几点：
- async 函数返回一个 Promise 对象，我们需要用 .then() 方法来获取其结果。
- await 关键字只能在 async 函数中使用。
- await 等待的是一个 Promise 对象，如果是直接值的话，也会被自动转化为一个已经 resolve 的 Promise。
- await 关键字会暂停代码执行，等待 resolve 的结果返回后继续执行。
我们以一个简单的例子来说明：
-- -------------------- ---- ------- -------- --------- - ------ --- --------------- -- ------------------- ----- - ----- -------- ------ - --------------------- ----- ------------ ------------------- - ------- ----------------- -------
以上代码中，我们定义了一个延时函数 sleep()。在 async 函数 main() 中，我们通过 await 关键字，等待 sleep(1000) 返回结果后再继续执行。因此，在 main() 函数调用时，将首先输出 start，然后暂停一秒后输出 end。而在 main() 函数被调用的同时，下一行代码直接输出 last line。
- TypeScript 中的 async/await
TypeScript 是一种强类型的 JavaScript 的语言，能够为我们在编写代码时带来更好的可读性，本来不明确的内容也因此变得更加清晰。而在 async/await 中，TypeScript 提供了以下几个关键字来规范其使用：
- Promise<t>：Promise 对象，其中的 <t> 标识该 Promise 返回值的类型。
- async：修饰函数时表示该函数返回一个 Promise。
- await：在 async 函数中等待 Promise 对象，直到其 resolve 成功。
- throw new Error('')：在 promise resolve 失败时手动抛出异常，调用 catch 语句捕获错误。
TypeScript 自带的 Promise 类型，能够避免掉 TypeScript 代码中 Promise 使用不标准的问题。
- 示例代码与实例演练
下面我们结合实际代码来进一步演示 TypeScript 中 async/await 的使用。
当使用 Node.js 进行请求时，可以通过以下两种方法来使用 async/await 来让代码更加简洁易懂。
- http 请求：
-- -------------------- ---- -------
------ - -- ------- ---- -------------------------
----- -------- ------ -
--- -
----- --- - ----- --------------------------------------
-----------------
- ----- ----- -
-----------------
-
-在以上代码中，我们使用了一个 Node.js 模块来发送请求，并以 async/await 的方式获取返回结果。当得到异常时，我们直接打印出了错误信息。
- mongodb 操作：
在进行 MongoDB 数据库操作时，我们同样能够使用 async/await 的方式，来简化代码逻辑。
-- -------------------- ---- -------
------ - -- ----------- ---- ----------
----- -------- ------ -
--- -
----- ------ - ----- -------------------------------------------------
----- -- - ------------------
----- --- - --------------------------
----- --- - ----- -----------------------
-----------------
---------------
- ----- ----- -
-----------------------
-
-在以上代码中，我们使用的是另外一个 Node.js 模块，用于连接 MongoDB 数据库。同样，在进行各种 MongoDB 操作时，使用 async/await 来简化代码也是十分常见的。
- 总结与回顾
本文通过简单地介绍了 async/await 的语法，详细解释了其在 TypeScript 中的使用技巧，并通过实际的代码案例来说明 async/await 带来的优势和使用注意事项。
异步编程在前端开发中是一个必须面对的问题，而 async/await 则是其中更加方便、易于理解和可读性高的解决方案。在 TypeScript 中，使用 async/await 会为我们带来更好的代码组织和更加严谨的开发体验。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64c72d1b10032fedd390b2cc