三个专业术语
1、主线程
所有的同步任务都是在主线程里执行的,异步任务可能会在macrotask或者microtask里面
- 同步任务: 指的是在主线程上排队执行的任务,只有前一个任务执行完毕,才能执行后一个任务。
- 异步任务: 指的是不进入主线程,某个异步任务可以执行了,该任务才会进入主线程执行。
2、微任务(micro task)
- promise
- async
- await
- process.nextTick(node)
- mutationObserver(html5新特性)
3、宏任务(macro task)
- script(整体代码)
- setTimeout
- setInterval
- setImmediate
- I/O
- UI render
通俗的来说,事件循环(
eventLoop)是单线程的JavaScript在处理异步事件时进行的一种循环过程,具体来讲,对于异步事件它会先加入到事件队列中挂起,等主线程空闲时会去执行事件队列中的事件。
线程执行顺序
主线程任务——>微任务——>宏任务 如果宏任务里还有微任就继续执行宏任务里的微任务,如果宏任务中的微任务中还有宏任务就在依次进行
主线程任务——>微任务——>宏任务——>宏任务里的微任务——>宏任务里的微任务中的宏任务——>直到任务全部完成
在同一轮任务队列中,同一个微任务产生的微任务会放在这一轮微任务的后面,产生的宏任务会放在这一轮的宏任务后面
在同一轮任务队列中,同一个宏任务产生的微任务会马上执行,产生的宏任务会放在这一轮的宏任务后面
示例
console.log('Start');
setTimeout(() => {
console.log('Timer');
}, 0);
Promise.resolve().then(() => {
console.log('Promise');
});
console.log('End');
执行顺序将是:
console.log('Start')console.log('End')console.log('Promise')console.log('Timer')
这是因为 'Start' 和 'End' 是同步代码,所以首先输出;接下来是微任务 'Promise' 被处理;最后才是宏任务 'Timer'。