前端 宏任务 微任务（JavaScript中的宏任务和微任务）

在 JavaScript 中   
    
    
    
  ，宏任务和微任务是指在执行代码的过程中的两种不同的任务类型   
    
    
    
  。

宏任务（macro task）指的是浏览器在执行代码的过程中会调度的任务


     


     


     


     
，比如事件循环中的每一次迭代    
    
    
    
、setTimeout 和 setInterval 等


     


     


     


     
。宏任务会在浏览器完成当前同步任务之后执行 




 




 




 




。

微任务（micro task）指的是在当前宏任务执行完成之后立即执行的任务 




 




 




 




，比如 Promise 的回调函数    


     


     


     


  、process.nextTick 等   

   

   

   

 。

举个例子   

   

   

   

 ，假设你有一个代码块：

console.log(Start); setTimeout(() => console.log(Timeout), 0); Promise.resolve().then(() => console.log(Promise)); console.log(End);

执行这段代码的输出顺序会是：

Start End Promise Timeout

这里的 setTimeout 和 Promise.resolve().then 都是异步操作

     

     

     

     ，但是它们会在不同的时间执行

     

     

     

     。setTimeout 是一个宏任务
  




  




  




  




，它会在主线程的事件循环中被调度执行  


  


  


  


，因此它会在同步任务执行完毕之后才会被执行
  




  




  




  




。而 Promise.resolve().then 是一个微任务 
     
     
     
     ，它会在当前宏任务执行完成之后立即执行  


  


  


  


。

在 JavaScript 中

   




   




   




   



，宏任务和微任务是相互独立的 



 



 



 



，在一次事件循环中会先执行所有的宏任务                     ，然后再执行所有的微任务 
     
     
     
     。举个例子


    




    




    




    


，假设你有这样的一个代码块：

console.log(Start); setTimeout(() => console.log(Timeout), 0); Promise.resolve().then(() => console.log(Promise)); console.log(End); setTimeout(() => console.log(Timeout 2), 0); Promise.resolve().then(() => console.log(Promise 2));

执行这段代码的输出顺序会是：

Start End Promise Promise 2 Timeout Timeout 2

在这段代码中



















，第一个 setTimeout 和第一个 Promise.resolve().then 都是在同步任务执行完之后执行的

   




   




   




   



。由于第一个 Promise.resolve().then 是一个微任务                     ，所以它会在第一个 setTimeout 之前执行 



 



 



 



。第二个 setTimeout 和第二个 Promise.resolve().then 也是在同步任务执行完之后执行的


     



     



     



     

，且它们的执行顺序与第一组宏任务和微任务的执行顺序是一样的                     。

在 JavaScript 中



















，宏任务和微任务的执行顺序是非常重要的   
    
    
    
  ，因为它会影响到你的代码的执行结果


    




    




    




    


。比如在异步编程中


     


     


     


     
，如果你希望在某个异步操作完成之后立即执行另一个操作 




 




 




 




，你可以使用微任务来实现



















。

总结一下   

   

   

   

 ，宏任务和微任务是 JavaScript 中用来管理异步操作的两种任务类型

     

     

     

     ，它们在执行顺序上有一定的差别                     。宏任务会在同步任务执行完之后执行
  




  




  




  




，而微任务会在当前宏任务执行完之后立即执行


     



     



     



     

。理解这两种任务的执行顺序对于编写高效的 JavaScript 代码是非常重要的



















。

在浏览器环境中  


  


  


  


，宏任务和微任务是通过浏览器的事件循环机制来管理的   
    
    
    
  。在每一次事件循环中 
     
     
     
     ，浏览器会先执行所有的宏任务

   




   




   




   



，然后再执行所有的微任务


     


     


     


     
。这个过程会不断重复 



 



 



 



，直到所有的宏任务和微任务都被执行完毕 




 




 




 




。

在 Node.js 中                     ，宏任务和微任务也是通过事件循环机制来管理的


    




    




    




    


，但是它的事件循环机制与浏览器的略有不同   

   

   

   

 。Node.js 中的事件循环使用的是 libuv 库来实现的



















，它会先执行所有的宏任务                     ，然后再执行所有的微任务


     



     



     



     

，最后再执行 I/O 操作的回调函数

     

     

     

     。这样的事件循环机制使得 Node.js 在处理 I/O 操作时有更好的性能
  




  




  




  




。