为什么同步代码在宏任务之后运行？

Question

正如我对事件循环的理解，事件循环将把回调推到回调堆栈中，但是，例如，下面的代码，同步代码console.log(2)在单击事件处理程序之后运行，为什么呢？

​

console.log(1)

document.body.addEventListener('click', () => {
  console.log(3)
})

document.body.click()

console.log(2)

​

Answer 1

通过这样做：

console.log(1)

document.body.addEventListener('click', () => {
    console.log(3)
})

document.body.click()

console.log(2)

结果是：

1
3
2

但通过这样做：

​

console.log(1)

document.body.addEventListener('click', () => {
    setTimeout( () => {
        console.log(3)
    },200);
})

document.body.click()

console.log(2)

​

结果是：

1
2
3

因此，我的结论是，click事件很好地放在堆栈中，但是它会立即解除堆栈。