前言
js是单线程的脚本语言,分为同步任务
和异步任务
,异步任务又分为微任务(MicroTask)
和宏任务(MacroTask)
。
异步任务
- 宏任务(MacroTask):setTimeout,setInterval,script等
- 微任务(MicroTask):promise.then,promise.nextTick,awit等
事件循环
主线程从任务队列
中读取事件,这个过程是循环不断的,即这种运行机制又被称为 Event Loop(事件循环)。
运行机制
先执行同步任务,遇到异步宏任务
则将异步宏任务放到宏任务队列
中,遇到异步微任务
则将微任务放入微任务队列
中,当所有同步代码执行完毕后,再将异步微任务从队列中调入主线程执行,微任务执行完毕后再将异步宏任务调入主线程执行,一直循环直至所有任务完成。
执行顺序: 同步任务 ---> 微任务 ---> 宏任务
async function async1(){
console.log("1");
// await async2();
async2();
console.log("2");
}
async function async2(){
console.log("3");
}
console.log("4");
setTimeout(() => {
console.log("5");
Promise.resolve().then(function(){
console.log("6");
});
}, 0);
setTimeout(() => {
console.log("7");
Promise.resolve().then(function(){
console.log("8");
});
}, 0);
async1();
new Promise(function(resolve){
console.log("9");
resolve();
}).then(function(){
console.log("10");
});
console.log("11");
//输出顺序:4->1->3->9->11->2->10->5->6->7->8
注释: 先执行同步任务4->1->3->9->11,在执行微任务1->10,再去执行异步任务setTimeout里的同步任务和微任务,特别注意await function method()是同步任务,await后下一行是微任务