js事件循环（Event Loop）

参考链接：浏览器事件循环机制 & 面试一定会问到的-js事件循环

JS是单线程的

虽然JS运行在浏览器中是单线程的，但是浏览器是事件驱动的（Event driven），浏览器中很多行为是异步（Asynchronized）的，会创建事件并放入执行队列中。浏览器中很多异步行为都是由浏览器新开一个线程去完成，一个浏览器至少实现三个常驻线程：

  • JS引擎线程
  • GUI渲染线程
  • 事件触发线程

JS引擎

JavaScript引擎是一个专门处理JavaScript脚本的虚拟机，一般会附带在网页浏览器之中，比如最出名的就是Chrome浏览器的V8引擎，如下图所示，JS引擎主要有两个组件构成：

  • 堆-内存分配发生的地方
  • 栈-函数调用时会形一个个栈帧

执行栈

function bar() {
console.log('bar');
}

function foo() {
console.log('foo');
bar();
}

foo();
执行过程中栈的变化

宏任务Macrotasks（Task）

  • script
  • setTimeout
  • setInterval
  • setImmediate
  • I/O
  • UI rendering

微任务Microtasks（Job）

  • process.nextTick
  • promises(new Promise不算，then后面的才是)
  • Object.observe
  • MutationObserver

简而言之：一次事件循环只执行处于 Macrotask 队首的任务，执行完成后，立即执行 Microtask 队列中的所有任务

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。