js的宏任务与微任务

在 JavaScript 中，任务可分为同步任务和异步任务，而异步任务又可分为宏任务和微任务：

宏任务：

指主线程上排队执行的任务，例如setTimeout、setInterval...

宏任务.png

微任务：

通常是需要在当前任务执行结束后立即执行的任务，例如Promise.then()、process.nextTick等

微任务.png

  • JavaScript 引擎首先会执行宏任务
  • 然后在每个宏任务执行完毕后，会立即执行微任务队列中的所有微任务。

  • 微任务队列中的任务执行完毕后，再去执行下一个宏任务，如此循环往复，直到所有任务都执行完毕。这种机制被称为事件循环（Event Loop）


    3.png

    以下是一个示例代码，用于演示宏任务和微任务的执行顺序：

 console.log(1)
    setTimeout(()=>{
        console.log(2)
    },0)
    const p = new Promise((res,rej)=>{
        console.log(3)
        res(1000)
        console.log(4)
    })
    p.then(data=>{
        console.log(data)
    })
    console.log(5)
  • 在上述代码中，首先会输出1 3 4 5，这是因为它们是同步任务会按照顺序立即执行。
  • 然后，setTimeout函数会被添加到异步宏任务队列中，Promise.then会被添加到微任务队列中。当主线程空闲时，会先执行异步微任务队列中的任务，即输出1000。

  • 最后，才会执行宏任务队列中的任务，输出2。


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

推荐阅读更多精彩内容