合规国际互联网加速 OSASE为企业客户提供高速稳定SD-WAN国际加速解决方案。 广告
>[info] ## 异步题一 ~~~ 下面的打印结果: script start async1 start async2 promise1 script end async1 end promise2 setTimeout 2.解释代码自上而下执行,但执行到第一个console.log 的时候开始输出'script start' 遇到setTimeout 进入webapi 然后当还是在webapi的线程和js线程线程形成多线程同步 但是setTimeout 虽然执行完了会进入宏任务队列中排队,执行到async1() 函数调用 开始执行输出'async1 start',执行到' await async2()' 开始触发'async2'函数打印出'async2' 此时因为'await' 修饰了'async2' 函数整体可以看作 new Promise((res,rej) => { async2() res() }).then(() => { console.log('async1 end') }) } then 回调此时是微任务队列中,此时接着看js线程,执行到Prmose 实列,输 出'promise1',遇到then再次进入微任务队列中,js线程中'script end' 打印,事件循环发现 js 线程已经没有值,开始调用微任务队列中依次进入两个回调依次输出 'async1 end' 'promise2',最后看宏任务队列中执行'setTimeout' ~~~ ~~~ 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') ~~~ >[info] ## 案例二 ~~~ start p1 p2 timeout1 p3 p4 interval 1.解释微任务执行完 轮到宏任务执行 ~~~ ~~~ console.log('start') let intervalId Promise.resolve() .then(() => { console.log('p1') }) .then(() => { console.log('p2') }) setTimeout(() => { Promise.resolve() .then(() => { console.log('p3') }) .then(() => { console.log('p4') }) intervalId = setInterval(() => { console.log('interval') }, 3000) console.log('timeout1') }, 0) ~~~ >[info] ## 案例三 ~~~ b f c a d ~~~ ~~~ setTimeout(() => { console.log('a'); }); Promise.resolve().then(() => { console.log('b'); }).then(() => { Promise.resolve('c').then(data => { setTimeout(() => { console.log('d') }); console.log('f'); return data; }); }).then(data => { console.log(data); }); ~~~ https://juejin.cn/book/6891929939616989188/section/6891940071243513868