JavaScript 把异步任务又做了进一步划分,异步任务又分为两类:
同步任务: 非耗时任务
异步任务又称 耗时任务
1. 宏任务 ( macrotask )
- 异步Ajax请求丶
- setTimeout 丶 setinterval
- 文件操作
- 其他宏任务
2. 微任务 ( microtaks )
- Promise.then .catch 和 .finally
- process.nextTick
- 其他微任务
宏任务和微任务的执行顺序
每一个宏任务执行完以后都会检查是否存在待执行的微任务,如果又,则执行完所有的微任务之后再执行下一个宏任务.
模拟场景解释
- 小明和小张一起买东西 ( 宏任务队列 )
- 假设当前只有一个收银员在前台,那么在小明结账的时候小张只能排队 (单程,宏任务按次序执行)
- 在小明买完东西以后,收银员问是否需要其他的东西, (宏任务执行完毕,检查是否有微任务)
- 小明说再拿点其他的东西. (执行微任务, 剩下的宏任务推迟)
- 等小明全部买完结账确定不再要其他东西了以后.小张再去结账 (所有微任务执行完毕,开始下一个宏任务)
通过代码分析宏任务和微任务输出的顺序
setTimeout ( function() {
console.log('1') //宏任务
})
new Promise(function (resolve){
console.log('2')
resolve() // 同步任务
}).then(function () {
console.log('3') //微任务
})
console.log('4') //同步任务
------------
输出结果是:2431
//1. 先执行所有同步任务,从上到下 . 输出24 再判断是否有微任务需要执行,输出3 最后等所有微任务执行完毕再执行下一个宏任务.
例2:
执行顺序:
1.先执行同步任务.输出结果1. new Promise也是同步任务 输出结果5, 两个延迟函数都是异步任务
2.同时在5输出完毕以后. .then是微任务,所以先将微任务放在排列队伍中.
3.全部的同步任务输出完毕.检查确定没有同步任务以后.执行可执行的微任务.输出结果6
4.检查所有微任务执行完毕.开始执行异步任务里面的宏任务.
最后输出顺序是156234789