JS执行原理(Event Loop事件循环、微任务、宏任务)

256 阅读1分钟

Snipaste_2022-05-23_19-35-04.png

1. 事件循环Event Loop概念介绍

事件循环Event Loop又叫事件队列,两者是一个概念

1.1. 什么是事件循环: 浏览器或者node环境执行js代码的一种规则

2. 宏任务和微任务概念介绍

2.1. js代码主要分两大类: 同步代码、异步代码
2.2. 异步代码又分为: 宏任务和微任务
  • 同步任务: 立即执行
  • 异步任务: 需要等一定事件才能执行 下面列举宏任务和微任务

Snipaste_2022-05-23_19-45-29.png

3. 事件循环Event Loop执行机制

  1. 进入script标签,就进入到第一次事件循环
  2. 遇到同步代码立即执行
  3. 遇到宏任务放到宏任务队列
  4. 遇到微任务放到微任务队列
  5. 执行完所以同步代码
  6. 执行微任务
  7. 微任务执行完毕,本次主线程执行栈清空
  8. 寻找下一个宏任务,重复步骤1-7 这种重复不断的机制,就叫做事件循环