同步任务:立即执行的任务,直接被主线程读取并执行
异步任务:异步执行的任务,会交给任务队列去处理,而异步任务又分为宏任务和微任务
宏任务
script,setTimeout,setInternal,setImmeditate,T/O,UI rendering
微任务
process,nextTick,promise.then(),object.observe,MutationObserver
执行顺序
同步任务直接进入执行栈由主线程直接执行,而异步任务会先移交给WebAPIs去处理,当异步任务被触发会将其回调函数放入任务队列中。执行栈空,则访问微任务队列,当微任务队列空后再去访问宏任务队列,如果在执行宏任务时遇到了微任务,则将微任务放入微任务队列。
微任务执行前提是执行栈为空,宏任务执行前提是微任务队列为空。
实例:
console.log('1')
setTimeout(() => {
console.log('2');
new Promise(resolve => {
console.log('3')
resolve();
}).then(() => {
console.log('4')
})
}, 0)
new Promise(resolve => {
console.log('5')
resolve();
}).then(() => {
console.log('6')
})
setTimeout(() => {
console.log('7');
}, 0)
setTimeout(() => {
console.log('8');
new Promise(resolve => {
console.log('9')
resolve();
}).then(() => {
console.log('10')
})
}, 0)
new Promise(resolve => {
console.log('11')
resolve();
}).then(() => {
console.log('12')
})
console.log('13');
执行栈空,查看微任务队列
执行微任务,微任务队列空则查看宏任务队列
执行宏任务时出现微任务,将微任务依次放入微任务队列,先执行微任务
最终控制台依次输出的结果是:1 5 11 13 6 12 2 3 4 7 8 9 10