js 宏任务和微任务

js 执行时首先会从宏任务中获取第一个并执行，执行过程中会将遇到的微任务放入微任务队列，当宏任务执行完成时再去依次执行微任务队列中的任务，执行完之后再去获取第二个宏任务，周而复始，直至全部执行完成。

宏任务和微任务之间的关系

console.log('1');
setTimeout(function() {
    console.log('2');
    process.nextTick(function() {
        console.log('3');
    })
    new Promise(function(resolve) {
        console.log('4');
        resolve();
    }).then(function() {
        console.log('5')
    })
})
process.nextTick(function() {
    console.log('6');
})
new Promise(function(resolve) {
    console.log('7');
    resolve();
}).then(function() {
    console.log('8')
})
setTimeout(function() {
    console.log('9');
    process.nextTick(function() {
        console.log('10');
    })
    new Promise(function(resolve) {
        console.log('11');
        resolve();
    }).then(function() {
        console.log('12')
    })
})

打印结果为：

// 首先执行第一个宏任务
1
7
// 宏任务执行完成，执行微任务
6
8
// 微任务执行完成，执行第二个宏任务
2
4
// 宏任务执行完成，执行微任务
3
5
// 微任务执行完成，执行第三个宏任务
9
11
// 宏任务执行完成，执行微任务
10
12
// 全部执行完成，结束

上面的运行结果是 js在浏览器中的运行结果，而nodejs的运行结果是：1 7 6 8 2 4 9 11 3 5 10 12。造成这种结果不一致的原因是因为js的 Event Loop 是根据 HTML5 中定义的规范，而 Nodejs 是由 libuv库 实现的。libuv库流程大体分为6个阶段：timers，I/O callbacks，idle、prepare，poll，check，close callbacks，和浏览器的microtask，macrotask那一套有区别。

宏任务(macrotask)：由宿主环境提供。

• I/O
• setTimeout
• setInterval
• setImmediate
• requestAnimationFrame

微任务(microtask)：由语言标准提供，可理解为回调函数。

• process.nextTick
• MutationObserver
• Promise .then .catch .finally