「1分钟--前端08」JS的宏任务和微任务

「1分钟--前端08」JS的宏任务和微任务
最新回答
爺丶蕝版莮陔

2026-10-21 21:54:14

JS的宏任务和微任务是JavaScript事件循环(Event Loop)中的两个重要概念,它们决定了代码的执行顺序。

  • 宏任务(Macrotask):

    定义:宏任务是指那些会被放入事件队列(Event Queue)中,等待主线程执行完毕后再被调用的任务。

    常见宏任务:主代码块、setImmediate(Node.js环境)、MessageChannel、setTimeout、setInterval等。

    执行顺序:宏任务的执行顺序遵循其优先级,主代码块优先级最高,其次是setImmediate、MessageChannel,最后是setTimeout和setInterval。

    特点:宏任务需要多次事件循环才能执行完,因为每次事件循环只能处理一个宏任务。

  • 微任务(Microtask):

    定义:微任务是指那些在当前宏任务执行完毕后,立即执行的任务。它们通常用于处理一些需要优先执行的异步操作。

    常见微任务:process.nextTick(Node.js环境)、Promise的回调函数、MutationObserver等。

    执行顺序:微任务的执行顺序也遵循其优先级,process.nextTick优先级最高,其次是Promise的回调函数,最后是MutationObserver。

    特点:微任务是一次性执行完的,即在当前宏任务执行完毕后,会立即执行所有微任务,直到微任务队列为空。

  • 事件循环机制:

    JavaScript引擎首先执行主代码块(即第一个宏任务)。

    在执行主代码块的过程中,如果遇到异步操作(如setTimeout、Promise等),则会将这些异步操作的回调函数放入相应的宏任务队列或微任务队列中。

    当主代码块执行完毕后,JavaScript引擎会检查微任务队列,并执行所有微任务,直到微任务队列为空。

    接着,JavaScript引擎会从宏任务队列中取出下一个宏任务进行执行,并重复上述过程。

  • 示例分析:

    以提供的代码示例为例,主程序和setTimeout都是宏任务,而两个Promise的回调函数是微任务。

    在执行主程序这个宏任务时,遇到了两个Promise的回调函数,它们被放入微任务队列中。

    主程序执行完毕后,JavaScript引擎立即执行微任务队列中的所有微任务(即两个Promise的回调函数)。

    微任务执行完毕后,JavaScript引擎再从宏任务队列中取出下一个宏任务(即setTimeout的回调函数)进行执行。

    因此,代码的输出结果为:先输出两个Promise的回调函数的结果,再输出setTimeout的回调函数的结果。