异步编程已经成为现代前端开发中不可避免的一部分。而 async 函数则是异步编程的重要工具之一。在 ECMAScript 2017（ES8）中，async 函数被引入标准，提供了一种更加优雅的方式来处理异步代码。而在 ECMAScript 2018（ES9）中，async 函数又有了新的特性和最佳实践。
async 函数的基本用法
async 函数是一个返回 Promise 对象的函数。在函数内部，可以使用 await 关键字来等待 Promise 对象的返回结果。例如：
----- -------- --------- - ----- -------- - ----- ---------------------------------- ----- ---- - ----- ---------------- ------ ----- - ------------------- -- -------------------
在上面的例子中，我们通过 async 函数获取了远程数据，并使用 await 等待数据返回。由于 async 函数返回的是一个 Promise 对象，我们可以使用 then 方法来处理返回的数据。
async 函数的新特性
Promise.allSettled
在 ECMAScript 2018（ES9）中，Promise.allSettled() 方法被引入标准。这个方法接收一个 Promise 数组作为参数，在所有 Promise 对象都完成后返回一个数组。这个数组中的每个元素都包含了对应 Promise 对象的状态和结果。例如：
----- -------- - - --------------------- ---- --------------------- ---- --------------------- ---- -- ---------------------------- ------------- -- ----------------------
在上面的例子中，我们创建了一个包含三个 Promise 对象的数组。其中第二个 Promise 对象会被拒绝。使用 Promise.allSettled() 方法后，我们可以获取到一个包含三个元素的数组，其中第一个元素的状态为 resolved，结果为 'data 1'，第二个元素的状态为 rejected，原因为 'error 1'，第三个元素的状态为 resolved，结果为 'data 2'。
Promise.prototype.finally
在 ECMAScript 2018（ES9）中，Promise.prototype.finally() 方法被引入标准。这个方法接收一个回调函数作为参数，在 Promise 对象无论是被解决还是被拒绝后都会执行这个回调函数。例如：
--------------------------------- -------------- -- ---------------- ---------- -- ------------------ ------------ -- ------------------- ----------- -- ------------------ ------------
在上面的例子中，我们使用 fetch 方法获取远程数据。在获取数据成功或失败后，都会执行 finally 方法中的回调函数。
async 函数的最佳实践
1. 避免过度使用 async 函数
虽然 async 函数是处理异步代码的好工具，但是过度使用它也会导致代码复杂度增加，影响代码的可读性和可维护性。因此，我们应该在必要的时候使用 async 函数，而不是过度使用它。
2. 处理错误
在 async 函数中处理错误非常重要。我们可以使用 try/catch 语句来捕获错误，并在 catch 块中处理错误。例如：
----- -------- --------- -
--- -
----- -------- - ----- ----------------------------------
----- ---- - ----- ----------------
------ -----
- ----- ------- -
-------------------
------ -----
-
-在上面的例子中，我们使用 try/catch 语句来捕获 fetch 方法和 response.json() 方法可能抛出的错误，并在 catch 块中输出错误信息，并返回 null 值。
3. 并行处理异步操作
在 async 函数中，我们可以使用 Promise.all() 方法来并行处理多个异步操作。例如：
----- -------- --------- -
----- ------- ------ - ----- -------------
------------------------------------------------ -- -----------------
------------------------------------------------ -- ----------------
---
------ - ------ ----- --
-在上面的例子中，我们使用 Promise.all() 方法来并行处理两个异步操作，并在两个操作都完成后返回数据。
总结
在 ECMAScript 2018（ES9）中，async 函数有了新的特性和最佳实践。我们可以使用 Promise.allSettled() 方法来获取多个 Promise 对象的状态和结果，使用 Promise.prototype.finally() 方法来处理 Promise 对象的状态改变，同时还需要注意避免过度使用 async 函数，处理错误和并行处理异步操作等最佳实践。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/660296a3d10417a222e603f1