在前端开发中，异步编程是非常常见的一种操作。然而在过去，我们需要使用 Promise 来进行异步操作的管理和处理。而在 ES6 中新增了 Async 和 Await 关键字，可以让异步编程更加简单和易于管理。
什么是 Async 和 Await
Async 和 Await 是 ES6 异步编程的新方法，让异步代码看起来像同步代码一样，方便代码的管理和调试。
Async：用于声明一个异步函数，返回一个 Promise 对象。异步函数中可以使用 Await 关键字来等待 Promise 的执行结果，可以使用 try/catch 来捕获 Promise 中的异常。
Await：用于等待一个 Promise 对象执行完毕，然后获取 Promise 中的返回值。Await 关键字只能在 Async 函数中使用。
Async 和 Await 使用方法
下面是一个使用 Async 和 Await 进行异步编程的例子：
// javascriptcn.com 代码示例
async function test() {
try {
let res1 = await fetch('/api/data1'); // 等待 fetch 请求完成
let data1 = await res1.json(); // 等待解析 json 数据
console.log(data1);
let res2 = await fetch('/api/data2');
let data2 = await res2.json();
console.log(data2);
let res3 = await fetch('/api/data3');
let data3 = await res3.json();
console.log(data3);
} catch (error) {
console.error(error);
}
}
test();在上面的例子中，我们使用 Async 和 Await 关键字来处理三个异步请求，将请求到的数据进行了打印输出。
必须注意到的是，我们使用了 try/catch 来捕获异步请求处理过程中出现的异常，并进行错误处理。
Async 和 Await 的优点
相较于 Promise，Async 和 Await 有以下优点：
更简单
Async 和 Await 使用起来更加简单，同时也更清晰明了。可以用同步代码的方式来完成异步操作，不需要使用大量的 then() 方法，大大降低了代码的复杂度和阅读难度。
更加易于管理和调试
Async 和 Await 方法的代码结构更加简单易懂，代码也更加可读性好，方便管理和调试。
更加安全
由于 Async 和 Await 关键字只能在 Async 函数中使用，并且每个 Async 函数返回的都是 Promise 对象，所以相较于 Promise，Async 和 Await 在数据流转过程中更加可控。
总结
在 ES6 中，Async 和 Await 带来了一种新的异步处理方式，能够将异步代码看起来像同步代码一样，同时使得异步代码的管理和调试更加方便。通过使用 Async 和 Await，我们不再需要大量的 then() 方法和回调函数来完成异步操作了。
在实际开发中，我们可以适当地使用 Async 和 Await 关键字，使得我们的代码结构简单易懂，可读性好，也更加方便技术管理和调试。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/654cacfb7d4982a6eb619684