-
宏任务（macro-task）
macro-task.png -
微任务（micro-task）
micro-task.png
同步任务与异步任务
eventloop.png
- 同步任务进入主线程，异步任务进入Event Table并注册函数
- 当指定的事情完成时，Event Table会将这个函数移入Event Queue。
- 主线程内的任务执行完毕为空，会去Event Queue读取对应的函数，进入主线程执行。
- 上述过程会不断重复，也就是常说的Event Loop(事件循环)。
- js引擎存在monitoring process进程，会持续不断的检查主线程执行栈是否为空，一旦为空，就会去Event Queue那里检查是否有等待被调用的函数。
宏任务与微任务
宏任务与微任务.png
微任务和宏任务皆为异步任务，但是微任务的优先级高于宏任务。
例子1：
console.log('script start');
setTimeout(function() {
console.log('setTimeout');
}, 0);
Promise.resolve().then(function() {
console.log('promise1');
}).then(function() {
console.log('promise2');
});
console.log('script end');
执行结果为：script start, script end, promise1, promise2, setTimeout
因为Promise是微任务，主线程会在同步任务做完后先清空微任务队列，再执行宏任务队列的setTimeout
例子2：
Promise.resolve().then(()=>{
console.log('Promise1')
setTimeout(()=>{
console.log('setTimeout2')
},0)
})
setTimeout(()=>{
console.log('setTimeout1')
Promise.resolve().then(()=>{
console.log('Promise2')
})
},0)
执行结果为：Promise1，setTimeout1，Promise2，setTimeout2
step1：
同步任务执行完毕，会去清空微任务，输出Promise1，同时生成宏任务 setTimeout1，setTimeout2
step2：
去宏任务队列查看，此时队列最前面是 setTimeout1 ，所以执行setTimeout1，同时生成微任务Promise2
step3：
宏任务结束后再去查看微任务队列，执行Promise2
step4：
微任务结束后再执行最后一个宏任务setTimeout2
