ECMAScript 2019 中如何将 Promise 转换为 async 和 await
在 JavaScript 开发中，Promises 是一种常用的异步编程方法，它让我们可以更容易地处理异步操作和代码复杂性。但是，Promises 仍然需要大量的回调函数和嵌套，很难处理逻辑，比如说错误处理和多个异步操作组合。因此，ES2017 引入了 async 和 await 关键字，它们提供了更简单和可读的方式来处理异步代码。本文将介绍如何将 Promise 转换为 async 和 await，并给出相关的示例代码。
- 什么是异步编程？
在 JavaScript 中，我们经常需要处理异步操作，比如说从服务器获取数据、读取文件等等。例如：
--------------------- ------------- -- ------------------- ------ --------------------
上述代码包含三个语句，第一个语句 console.log('Start') 会立即执行，输出 Start。第二个语句会延迟 1 秒执行，输出 End。第三个语句会立即执行，输出 Next。因此，上述代码执行的结果是：
----- ---- ---
由此可见，异步操作可能会在后面执行，代码的执行顺序并不是我们期望的顺序。在异步编程中，我们需要等待异步操作完成之后再执行后续的代码。
- Promises
Promises 是用于处理异步操作的对象。它的基本思想是在异步操作完成时执行某些代码。Promises 可以解决回调函数带来的嵌套和可读性差的问题。
一个 Promise 有三种状态：pending、resolved、rejected。在 promise 进入 resolved 或 rejected 状态之前，称为 pending 状态。当 promise 从 pending 状态过渡到 resolved 状态时，它调用相应的回调函数来处理成功的值。当 promise 从 pending 状态过渡到 rejected 状态时，它调用相应的回调函数来处理错误信息。
----- ------- - --- ----------------- ------- -- -
-- -------------- - -- - -- -
-------------------
- ---- -
----------------
-
---
-------
-------------- -- -
--------------------
--
-------------- -- -
---------------------
---上述代码中，我们创建了一个 Promise 对象，它是一个异步操作，并且随机返回成功或失败。当 Promise 进入 resolved 状态时，调用 .then() 方法来打印成功的值。当 Promise 进入 rejected 状态时，调用 .catch() 方法来打印错误信息。
- async 和 await
ES2017 引入了 async 和 await 两个关键字，它们构成了一种更简单和可读的异步编程方式。async 关键字用于声明一个异步函数，它会自动返回一个 Promise 对象。await 关键字用于暂停异步函数的执行，直到 Promise 进入 resolved 或 rejected 状态。await 关键字只能在 async 函数中使用。
----- -------- ------------ - ----- -------- - ----- ------------------------------------------------------------------------------ ----- ------- - ----- ---------------- ------ -------- - --------------------------- -- - --------------------- ---------------- -- - --------------------- ---
上述代码中，我们定义了一个异步函数 getWeather()，它使用了 await 关键字来等待 fetch() 函数的结果。fetch() 函数是一种异步函数，它返回一个 Promise 对象，因此我们可以在 getWeather() 函数中使用 await 来暂停执行，直到 Promise 进入 resolved 状态。getWeather() 函数返回一个 Promise 对象，并可以使用 .then() 和 .catch() 方法来处理结果和错误。
- 将 Promise 转换为 async 和 await
我们可以使用 async 和 await 来将 Promise 转换为更可读和简单的代码。我们可以将 Promise 对象赋值给变量并使用 await 等待 Promise 结果。下面是示例代码：
-------- ---------------- -
------ --- ----------------- ------- -- -
------------- -- -
---------------- ----------
-- ------
---
-
----- -------- -------------- -
----- ------ - ----- -----------------
--------------------
-
---------------上述代码中，我们定义了一个 Promise 对象 promiseExample()，它会等待 1 秒后返回一个字符串 'Promise Example'。然后，我们定义了一个 async 函数 asyncExample()，它使用了 await 关键字等待 promiseExample() 函数的返回值。在 asyncExample() 函数中我们可以像普通的同步函数一样访问变量 result。
- 结论
在 JavaScript 中，异步编程是必不可少的，而 async 和 await 关键字提供了简单和可读的方式来处理异步操作。使用 async 和 await 可以消除一些常见的异步编程问题，比如说回调函数和异步操作的嵌套。我们应该尽可能地使用 async 和 await，以提高代码的可读性和可维护性。
参考资料：
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/67067576d91dce0dc85d4b6d