乐趣区

关于前端:asyncawait实现原理

async/await 是 ES2017 带来的异步编程语法糖,实现了让异步代码看起来像同步代码的成果。

async/await 的实质是基于 Promise,它并不是一种新的异步解决形式,而是 Promise 的一种新的语法封装降级。

上面是 async/await 的实现原理:

async 函数实质上是一个 Generator 函数,返回一个 Promise 对象。

await 表达式实质上是一个 Promise 对象的期待调用,相当于 Generator 函数的 yield 命令。

async 函数会把函数体内的代码封装成一个 Promise 对象并返回。

当 async 函数执行时,如果遇到 await,则会将 async 函数的执行挂起,同时执行表达式前面的 Promise 对象的 then 办法,直到 Promise 对象的状态扭转后,再复原 async 函数的执行,并返回 Promise 对象的响应后果。

如果 await 前面的表达式是一个 Promise 对象,那么 await 将期待 Promise 对象的状态扭转,相当于 yield 前面的 argument.then()。

如果 await 前面的表达式不是 Promise 对象,那么 await 将立刻返回表达式的值。

综上所述,async/await 的实现实质上是将异步操作封装成 Promise 对象,并在外部通过 Generator 函数管制异步操作的执行程序,从而使得异步操作的代码看起来像同步操作的代码,进步了异步编程的可读性和可维护性。

退出移动版