await探究
这周在js群里讨论了一道今日头条的面试题,这题考察的是对microtask(微任务)和micratask(宏任务)的理解。题目和输出如下: async function async1() { console.log('async1 start'); await async2(); console.log('async1 end'); } async function async2() { console.log('async2'); } console.log('script start'); setTimeout(function() { console.log('setTimeout'); }, 0); async1(); new Promise(function(resolve) { console.log('promise1'); resolve(); }).then(function() { console.log('promise2'); }); console.log('script end'); // output: // script start // async1 start // async2 // promise1 // script end // async1 end // promise2 // setTimeout 这里就不对微任务和宏任务进行深入探究了,这里我们来探讨一个有意思的小问题(假设你已经掌握了微任务和宏任务)。 很多人对于async1 end出现在script end之后,而不是出现在async2之后感到有所疑惑。 出现这个疑惑是因为对await的工作原理不够了解,下面我们来解释一下。 先说说为什么有的人会认为async1 end出现在script end之后。这是因为,在代码的书写上,由于使用了await关键字,所以可以使得我们用同步的代码去写异步的代码。 await async2(); console.log('async1 end'); 很多人会觉得是js引擎在执行第一句的时候会暂停,等异步函数执行完了再去执行第二句,这就是误区所在。async/await的作用只是让我们像写同步代码一样写异步代码,而不是把异步代码变成同步代码。 这段代码还是异步的。 ...