event Loop事件循环

1、event Loop 事件循环

javascript的事件分两种：宏任务（macro-task）和 微任务（micro-task）

const promise = new Promise((resolve) => {
    console.log(1);
    resolve();
    console.log(2);
});
setTimeout(() => {
    Promise.resolve().then(() => {
        console.log(9);
    });
    console.log(3);
}, 100);
promise
    .then(() => {
        setTimeout(() => console.log(4), 1000);
        console.log(5);
    })
    .then(() => {
        console.log(6);
    });
setTimeout(() => console.log(7));
console.log(8);

1、宏任务同步先输出：1，2

2、setTimeout(3) 有100ms延时先挂起

3、promise 微任务 then1，then2加入miro-task

4、settimeout(7) 宏任务加入marco-task

5、宏任务同步先输出：8

6、执行then1，输出：5，setTimeout(4)延时1000ms挂起

7、执行then2，输出：6

8、再执行宏任务settimeout(7)，输出：7

9、setTimeout(3) 时间到，加入marco-task，输出：3，promise(9)微任务加入主线程，输出：9

10、setTimeout(4) 时间到，加入marco-task，输出：4

11、执行完毕 ： 【1、2、8，5，6，7，3，9，4】

 

同：【1，2，8】

mirco-task:【then1，then2】

marco-task：【settimeout(7)，setTimeout(3)，setTimeout(4)】