在 JavaScript 中,异步编程是非常常见的。在过去的几年中,Promise 已经成为了异步编程的主流方式。但是,Promise 的使用还是有一些限制,例如它不能很好地处理多个并发请求或嵌套回调。ES2017 引入了 async/await,这是一种更加简洁和易于理解的异步编程方式。
async/await 的基础
async/await 是基于 Promise 的一种语法糖。在使用 async/await 时,我们需要使用 async 关键字来声明一个函数为异步函数,并使用 await 关键字来等待一个 Promise 对象的结果。
async function fetchData() { const response = await fetch('https://jsonplaceholder.typicode.com/todos/1'); const data = await response.json(); return data; }
在上面的代码中,fetchData 函数是一个异步函数,它使用 await 关键字来等待 fetch 和 response.json 的结果。由于 await 关键字只能在异步函数中使用,因此我们需要使用 async 关键字来声明 fetchData 函数为异步函数。
错误处理
在使用 async/await 时,我们可以使用 try/catch 语句来捕获 Promise 中的错误。如果 Promise 被 reject 了,那么 await 语句将会抛出一个异常,我们可以在 catch 语句中捕获这个异常。
-- -------------------- ---- ------- ----- -------- ----------- - --- - ----- -------- - ----- ------------------------------------------------------ ----- ---- - ----- ---------------- ------ ----- - ----- ------- - ------------------- - -展开代码
在上面的代码中,如果 fetch 或 response.json 抛出了一个异常,那么这个异常将会被捕获并打印到控制台中。
并发请求
使用 async/await,我们可以很容易地处理多个并发请求。我们可以使用 Promise.all 方法来等待多个 Promise 对象的结果。
async function fetchData() { const [user, posts] = await Promise.all([ fetch('https://jsonplaceholder.typicode.com/users/1').then(response => response.json()), fetch('https://jsonplaceholder.typicode.com/posts?userId=1').then(response => response.json()), ]); return { user, posts }; }
在上面的代码中,我们使用 Promise.all 方法来等待两个 Promise 对象的结果。结果将会以一个数组的形式返回,并且数组中的顺序与 Promise.all 方法中传入的顺序一致。
总结
async/await 是一种非常方便的异步编程方式,它可以让我们更加轻松地处理异步操作。在使用 async/await 时,我们需要注意错误处理和并发请求的问题。如果你还没有使用过 async/await,那么建议你尝试一下,相信它会让你的代码更加简洁易读。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/65ffba22d10417a222af65c0