前端异步代码输出题汇总
我看了一些帖子和面经,简单的总结一下,比较常见和简单的异步输出题。要是侵权了,请联系我删帖。
const promise = new Promise((resolve, reject) => { console.log(1) console.log(2) }) promise.then(() => { console.log(3) }) console.log(4) 答案:1 2 4 解释:顺序执行 打印 1,2 promise调用then方法,状态是需要改变的,当前没有变,没有不执行。继续打印4
const promise = new Promise((resolve, reject) => { console.log(1) setTimeout(() => { console.log('timerStart') resolve('success') console.log('timerEnd') }, 0) console.log(2) }) promise.then((res) => { console.log(res) }) console.log(4) 答案:1 2 4 timerStart timerEnd success 我的理解: 打印 1 遇到st定时器 进入宏任务队列 打印2 then 方法没有被调用 (这里是进入微任务队列吗,还是等状态改变了再进入微任务队列???) 打印4 目前只有宏任务 去解决定时器里面的 打印 timerStart 将promise的状态改变 此时 then方法 进入微任务队列 打印timerEnd 宏任务结束 执行微任务 then方法,打印success
console.log('start') setTimeout(() => { console.log('a') Promise.resolve().then(() => { console.log('c') }) }) Promise.resolve().then(() => { console.log('b') setTimeout(() => { console.log('d') }) }) console.log('end') 答案:start end b a c d 我的理解: 打印start st宏任务 then 微任务 打印 end 执行微任务 因为已经resolve了,所以可以调用then方法 打印b 遇到定时器2 宏任务队列+1 微任务结束 宏任务队列有两个,执行第一个 打印a 又遇到了then 进入微任务 这个宏任务已经结束了 处理微任务 打印c 处理宏任务2 打印d
async function async1() { console.log("async1 start"); await async2(); console.log("async1 end"); setTimeout(() => { console.log('timer1') }, 0) } async function async2() { setTimeout(() => { console.log('timer2') }, 0) console.log("async2"); } async1(); setTimeout(() => { console.log('timer3') }, 0) console.log("start") 答案: async1 start async2 start async1 end timer2 timer3 timer1 我的理解: 调用async1函数 打印async1 start 遇到await了!!! await 后面的这个函数我们还是要执行的 调用async2函数 st宏任务1 打印 async2 这个函数2已经执行完毕了 但是因为await 所以函数1的代码就不执行了(放入微任务队列中????????????) st宏任务 2 打印 start 微任务 继续执行async1函数 打印aysnc1 end st宏任务3 宏任务队列 宏任务1 打印 tmier2 宏任务2打印timer3 宏任务3 打印timer1
今天时间有限,就先总结到这里。大家看看哪里有问题,可以提出来。
我也是第一次写这种技术,发现自己是个垃圾,写的好烂,只有自己能看懂,还有一些地方说不清
祝大家面试顺序~