宏任务与微任务

//  此文件为JS文件  需要在nodejs环境运行

const { rejects } = require("assert")

const { resolve } = require("path")

// js代码是单线程的  在主线程上运行  如果代码是异步的 那么一般会有一个回调函数  不同的异步任务对应不同的回调 比如计时器 Ajax

// 不同的回调会交给不同的模块去处理

// 宏任务

//     分类：setInterval   setTimeout  requestAnimationFrame(用于告诉浏览器在下个动画前调用回调函数)

//     1.宏任务所处的队列就是宏任务队列

//     2.宏任务队列可以有多个

//     3.第一个宏任务队列中只有一个任务：执行主线程的js

//     4.第一个宏任务队列中的所有任务全部执行完成，查看是否有微任务队列，如果有，先执行微任务队列中的所有任务，如果没有，就查看是否有其他宏任务队列

// 微任务

//     分类：new Promise().then(回调)  process.nextTick()

//     1.微任务所处的队列就是微任务队列

//     2.只有一个微任务队列

//     3.在上一个宏任务队列执行完毕后，如果有微任务队列，就会执行微任务队列中的所有任务

console.log('---------start-----------')

setTimeout(function(){

    console.log("setTimeout被执行")

},0)

new Promise((resolve,reject)=>{

    for(var i=0;i<5;i++){

        console.log(i)

    }

    resolve();

}).then(()=>{

    console.log('promise实例成功回调执行')

})

console.log('----------end-----------')

// 输出结果为:

// ---------start-----------

// 0

// 1

// 2

// 3

// 4

// ----------end-----------

// promise实例成功回调执行

// setTimeout被执行

// 原理：

// 第一个宏任务队列                   第二个宏任务                              微任务

// 执行主线程上代码                   setTimeout                            new Promise().then

// 注意：new Promise() 这个过程是同步的  .then()才是异步的

//                                 宏任务                              微任务

// 谁发起的                  宿主（Node，浏览器）                       js引擎

// 具体事件                  scrpit (可以理解为外层同步代码)            Promise.then()

//                         setTimeout/setInterval                    process.nextTick()

//                         UI rendering/ UI事件                      MutaionObserver

//                         postMessage,MessageChannel              

//                         setImmediate

// 谁先运行                         后运行(不考虑主线程)                  先运行

// 会触发新一轮的Tick么              会                                  不会