持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第10天，点击查看活动详情

题外话

不知道小伙伴第一关的5道题目，答的怎么样，没掉队的就往下看第二关吧

今天的第二关是Promise和setTimeout结合的题目

注意⚠️：setTimeout，setInterval是宏任务

第二关

2.1

console.log('start')
setTimeout(() => {
  console.log('time')
})
Promise.resolve().then(() => {
  console.log('resolve')
})
console.log('end')

执行过程：

script宏任务开始执行，遇见同步代码start
遇见setTimeout加入宏任务列表
Promise.resolve().then()加入微任务列表
执行同步代码end
下一个事件循环，执行微任务执行同步代码resolve
一个微任务执行完毕，开始执行下一个宏任务，执行同步代码time 结果：

start
end
resolve
time

2.2

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);

执行过程：

首先遇见new Promise执行1
定时器记作宏2
指定同步代码2
跳出promsie函数，遇见promise.then，但是状态没有改变还是pending，这里理解为先不执行
执行同步代码4
一轮循环之后，再次查找微任务，没有执行宏任务，执行宏2的定时器，
首先执行定时器里面的同步代码timeStart，之后将promise状态变为resolved，并将promise.then推入微任务列表。最后执行timeEnd
宏任务执行完毕，开始查找新一轮微任务，执行promise.then 结果：

1
2
4
timeStart
timerEnd
success

2.3

setTimeout(() => {
  console.log('timer1');
  setTimeout(() => {
    console.log('timer3')
  }, 0)
}, 0)
setTimeout(() => {
  console.log('timer2')
}, 0)
console.log('start')

执行过程：

遇见第一个定时器及记作宏1，遇见第二个计时器记作宏2
执行同步代码start
查找是否有微任务，没有指定第一个定时器，指定同步代码timer1，内部定时器记作宏3
指定宏2timer2
再次查找微任务，没有执行宏3timer3 结果：

start
timer1
timer2
timer3

setTimeout(() => {
  console.log('timer1');
  Promise.resolve().then(() => {
    console.log('promise')
  })
}, 0)
setTimeout(() => {
  console.log('timer2')
}, 0)
console.log('start')

执行过程：

遇见定时器记作宏1，再次遇见定时器记作宏2
执行同步代码start
查找微任务列表，没有执行宏1，执行同步代码timer1，遇见Promise.resolve().then()记作微1
查找微任务列表，执行微1promise
微任务执行完毕执行宏2timer2 结果：

start
timer1
promise
timer2

2.4

Promise.resolve().then(() => {
  console.log('promise1');
  const timer2 = setTimeout(() => {
    console.log('timer2')
  }, 0)
});
const timer1 = setTimeout(() => {
  console.log('timer1')
  Promise.resolve().then(() => {
    console.log('promise2')
  })
}, 0)
console.log('start');

执行过程：

遇见Promise.resolve().then记作微1，遇见定时器记作宏1
执行同步代码start
执行微1，promise1，遇见定时器记作宏2
指定宏1，同步代码timer1，遇见 Promise.resolve().then记作微2
执行微2，promise2
指定宏2，timer2 结果：

start
promise1
timer1
promise2
timer2

Promise系列（四）

题外话

第二关

2.1

2.2

2.3

2.4