宏任务和微任务的执行顺序是怎样的

简介: 宏任务和微任务的执行顺序是怎样的

宏任务(macro-task)和微任务(micro-task)在事件循环中的执行顺序如下:

  1. 当执行脚本开始时,会先执行一个宏任务(通常是脚本本身)。
  2. 执行完当前宏任务后,检查微任务队列。
  3. 如果微任务队列不为空,则按照先进先出的顺序依次执行所有微任务,直到微任务队列为空。这意味着微任务会在下一个宏任务之前执行。
  4. 当前宏任务执行完毕后,浏览器会渲染页面更新UI。
  5. 检查是否有新的宏任务进入事件队列。如果有,则选择最早进入队列的宏任务,并执行它。如果队列为空,则继续等待新的宏任务进入队列。
  6. 重复步骤2-5,循环执行宏任务和微任务。

简而言之,微任务会在当前宏任务执行完毕后立即执行,而宏任务则需要等待当前宏任务执行完毕后,再从宏任务队列中选择下一个宏任务执行。

注意:在某些情况下,宏任务执行期间可能会产生新的微任务,这些新的微任务会被添加到微任务队列中,并在当前宏任务执行完毕后立即执行。这意味着微任务可能会被插入到宏任务之间执行。这种情况下,微任务优先级高于宏任务。

相关文章
|
2月前
|
前端开发 JavaScript API
宏任务与微任务执行顺序及对比记录
宏任务与微任务执行顺序及对比记录
61 0
|
2月前
|
JavaScript 前端开发
微任务与宏任务的区别
微任务与宏任务的区别
|
2月前
|
前端开发 JavaScript UED
|
9月前
|
前端开发 JavaScript
30 # 宏任务和微任务的区分
30 # 宏任务和微任务的区分
21 0
|
2月前
|
前端开发 JavaScript
微任务与宏任务
微任务与宏任务
17 1
|
2月前
|
JavaScript 前端开发
前端 JS 经典:宏任务、微任务、事件循环(EventLoop)
前端 JS 经典:宏任务、微任务、事件循环(EventLoop)
29 0
|
2月前
|
存储 JavaScript 前端开发
JS的执行原理,一文了解Event Loop事件循环、微任务、宏任务
了解JavaScript的事件循环和任务队列对于处理异步任务至关重要。事件循环由主线程和任务队列组成,当主线程执行完同步任务后,会检查任务队列,按顺序执行宏任务和微任务。宏任务包括`setTimeout`等,微任务如`Promise`的回调。在实际开发中,事件循环保证了代码的非阻塞执行,提高了用户体验。例如,`setTimeout`的回调会在当前宏任务结束后,所有微任务执行完才会执行。理解这一机制对于解决面试中的异步问题非常有帮助。
37 0
JS的执行原理,一文了解Event Loop事件循环、微任务、宏任务
|
2月前
|
JavaScript 前端开发 调度
(详解)js中什么是宏任务、微任务?宏任务、微任务有哪些?又是怎么执行的?
(详解)js中什么是宏任务、微任务?宏任务、微任务有哪些?又是怎么执行的?
75 1
|
2月前
|
监控 前端开发 JavaScript
Javascript宏任务与微任务以及事件循环
Javascript宏任务与微任务以及事件循环
|
2月前
|
JavaScript 前端开发
什么是宏任务和微任务
什么是宏任务和微任务
134 0