浏览器的事件循环

JavaScript的任务分为同步和异步，同步任务是直接放在主线程队列执行，而异步任务是放在任务队列中，若多个异步任务则需要在任务中排队等待（类似于缓冲区）。

单线程：一个任务完成后才能执行下一个任务。

主线程用于浏览器处理用户事件和页面绘制。

调用栈就是函数执行的地方，有主线程在运行js代码中形成的，函数执行后，它会从栈中被移除。

检查调用栈是否为空以及讲某个任务添加到调用栈中的个过程就是事件循环。

 

浏览器端事件循环中的异步队列有两种：宏任务队列(macrotask)和微任务队列(microtask)。其目的为了异步队列任务，划分优先级。

宏任务：ajax、setTimeout、setinterval、DOM监听、UI Rendering

微任务：Promise的then回调、Mutation Observe API、queueMicrotask

 

同步代码：

　

console.log(1);
console.log(2);
console.log(3);

 

异步代码：

　　计时器，ajax，读取文件等

setTimeout(()=>{
    console.log(1);
},1000)
setTimeout(()=>{
    console.log(2);
},100)
setTimeout(()=>{
    console.log(3);
},10)

当同时存在同步与异步代码情况下，会优先执行同步代码

for(let i=0;i<1000;i++){//同步代码
    console.log(1);
}
setTimeout(()=>{//异步代码
    console.log(2);
},0);
setTimeout(()=>{
    console.log(2);
},0);
console.log(5);//同步代码

//先打印1000个1，后打印5，最后再打印2

 

标签：异步,console,log,队列,任务,循环,事件,浏览器,setTimeout
来源： https://www.cnblogs.com/Hollow-Z/p/16475882.html