很多新晋JS玩家难以处理好的问题就是辨识出哪些代码是同步的,哪些是异步的。因此ES7的async/await就成了救命稻草一般,遇事不决就用await来调用xD。

这本身倒没什么问题,但是竟然有妖言惑众生成await就是“阻塞”了事件循环。那么在await一个耗时间的操作过程中,到底会不会执行别的任务?实际上await也不过是把当前函数的执行暂时打断,等到结果返回之后再继续执行,在函数内部看起来是同步的罢了。

一个简单的验证办法:我们await一个耗时2.5s的操作,并在await之前设置一个1s后就执行的任务,如果await真的阻塞了事件循环,那么无论如何1s内也不应该看到前一个任务的结果。

(async function() {
  console.log('haha');
  setTimeout(function() {
    console.log('first timeout');
  }, 1000);
  await waitMe();
  console.log('finish');
})();

function waitMe() {
  return new Promise((resolve, reject) => {
    setTimeout(function() {
      console.log('second timeout');
      resolve();
    }, 2500);
  })
}

不言自明。