macro-task(宏任务):包括整体代码script,setTimeout,setInterval
micro-task(微任务):Promise,process.nextTick
整体script作为第一个宏任务进入主线程执行,遇到promise,new Promise立即执行;.then分发到微任务中;遇到setTimeout、setInterval,将其回调函数分发到宏任务中;第一个script作为第一个宏任务被执行完后,查看是否有微任务,如果有则执行微任务,执行完微任务则第一轮事件循环结束;开始第二轮事件循环,仍从宏任务开始,从宏任务队列中拿出一个宏任务进行执行,发现定时器回调函数,立即执行(执行顺序同上),执行完以后继续从宏任务队列中拿出一个宏任务继续执行。无限循环,直至任务全部执行完毕
示例:
console.log('执行开始 1');//1 第一轮事件循环宏任务第一次打印 setTimeout(function() { console.log('setTimeout1执行 6');//6 第二轮事件循环宏任务第一次打印 -- 至此第二轮事件循环结束 },0); setTimeout(function() { new Promise(function(resolve){ console.log('setTimeout2中的promise 7');//7 第三轮事件循环宏任务第一次打印 }).then(function(){ console.log('setTimeout2中的promise.then执行 9');//9 第三轮事件循环微任务第一次打印 -- 至此所有事件循环结束,代码执行完成 }); console.log('seTimeout2中promise后面的console执行 8');//8 第三轮事件循环宏任务第二次打印 },0) console.log('代码中间段console执行 2');//2 第一轮事件循环宏任务第二次打印 Promise.resolve().then(function() { console.log('promise执行.then1执行 4');//4 第一轮事件循环微任务第一次打印 }).then(function() { console.log('promise.then2执行 5');//5 第一轮事件循环微任务第二次打印 -- 至此第一轮事件循环结束,进入第二轮事件循环 }) console.log('执行最后一行代码 3');//3 第一轮事件循环宏任务第三次打印