javascript从诞生之日起就是一门  单线程的  非阻塞的  脚本语言,单线程意味着,javascript代码在执行的任何时候,都只有一个主线程来处理所有的任务,非阻塞靠的就是 event loop(事件循环),本文就讲解下事件循环。

event loop它最主要是分三部分:主线程、宏队列(macrotask)、微队列(microtask)

js的任务队列分为同步任务和异步任务,所有的同步任务都是在主线程里执行的,异步任务可能会在macrotask或者microtask里面

宏队列(macrotask)

setTimeout、setInterval、setImmediate、I/O、UI rendering

微队列(microtask)

promise.then、process.nextTick

执行顺序

任务进入执行栈,先看任务是同步任务还是异步任务,同步任务放入主线程执行,异步任务放到任务队列中。

1、先执行主线程

2、遇到宏任务放到宏队列, 遇到微任务放到微队列

3、主线程执行完毕 ,开始读取任务队列中的任务,先去执行微任务,微任务执行完毕再去执行宏任务

依次循环。。。

js事件循环机制(Event Loop)_异步任务

宏任务和微任务的区别在于在事件循环机制中,执行的机制不同

每次执行完所有的同步任务后,会在任务队列中取出异步任务,先将所有微任务执行完成后,才会执行宏任务
所以可以得出结论, 微任务会在宏任务之前执行。
我们在工作常用到的宏任务是 setTimeout,而微任务是 Promise.then

js事件循环机制(Event Loop)_前端_02

这张图的意思就是:

1)、存在微任务的话,那么就执行所有的微任务

2)、微任务都执行完之后,执行下一个宏任务

3)、1, 2以此循环着

对于微任务的执行顺序上也有些需要注意的地方

基本上,若你喜欢异步任务尽可能快地执行,那就使用process.nextTick;