在 Web 开发中，有大量的异步编程需求，比如获取数据，进行网络请求或者执行复杂的计算。然而，传统的异步编程模型（比如使用回调函数和 Promise）往往导致代码可读性和可维护性较差，使得错误处理和代码扩展更加困难。
ES6 中引入了 async/await 关键字，可以有效地简化异步编程。async/await 结合了 Promise 和 Generator 的优势，使得代码更加易读、易维护和易于扩展。下面我们看一下如何使用 async/await 进行异步编程。
async/await 的使用
async/await 关键字的使用非常简单。在函数声明时添加 async 关键字，表明该函数内部包含异步操作，然后使用 await 关键字等待异步操作完成。例如：
async function fetchData() {
const response = await fetch('https://api.example.com/data');
const data = await response.json();
console.log(data);
}在上面的例子中，我们使用了 async 关键字声明了一个名为 fetchData 的异步函数。这个函数内部包含了两个异步操作：请求数据和解析数据。使用 await 关键字等待异步操作完成后，我们成功地获取了 data 并输出到控制台上。
在 async/await 中，异步操作被表示为 Promise，而 await 关键字可以将 Promise 转换为普通值。如果 Promise 被拒绝，await 也会抛出一个错误（这个错误可以使用 try/catch 进行捕获）。
错误处理
在传统的 Promise 中，错误处理通常使用 reject 回调函数来处理。然而，在 async/await 中可以使用 try/catch 来处理异步代码中的错误。例如：
-- -------------------- ---- -------
----- -------- ----------- -
--- -
----- -------- - ----- --------------------------------------
----- ---- - ----- ----------------
------------------
- ----- ------- -
---------------------
-
-在上面的例子中，我们使用了 try/catch 来处理异步操作中的错误。如果请求或解析数据时发生错误，我们会输出错误消息到控制台上。
并行执行异步操作
async/await 也可以用于并行执行异步操作。首先，我们可以使用 Promise.all() 函数来并行执行多个异步操作，例如：
async function fetchMultipleData() {
const [data1, data2, data3] = await Promise.all([
fetch('https://api.example.com/data1').then(response => response.json()),
fetch('https://api.example.com/data2').then(response => response.json()),
fetch('https://api.example.com/data3').then(response => response.json())
]);
console.log(data1, data2, data3);
}在上面的例子中，我们使用了 Promise.all() 函数并行执行了三个数据请求。使用数组解构语法，我们将三个请求的数据存储在 data1、data2 和 data3 中，并将它们打印到控制台上。
结论
async/await 是一种非常有用的工具，可以简化异步编程，使代码更加易阅读、易扩展和易维护。我们可以使用 await 关键字等待异步操作完成，使用 try/catch 来处理错误，以及使用 Promise.all() 函数并行执行多个异步操作。异步编程是 JavaScript 中的重要主题，在 ES6 中引入 async/await 关键字，使得异步编程更加容易。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/674ee39ce884a3e30f2ab4ba