JavaScript-宏任务、微任务

47 阅读2分钟

单线程

我们都知道JavaScript是单线程,那么线程一定会有自己的容器进程:浏览器或Node

浏览器是多进程吗?

浏览器是多进程的,每个tab页面都会开启一个新的进程,而浏览器的每个进程都会有一个进程来处理我们的JS代码,这个进程就是JavaScript代码的进程

JavaScript单线程执行过程

JavaScript是单线程的,这意味着当我们执行到比较耗时的代码时,那么下面的代码会等到耗时的代码执行完之后才能执行,就会造成阻塞。而这些耗时的操作其实并不是交给JavaScript线程来做的,而是交给浏览器其他的线程来操作。比如说:网络请求、定时器等。当JavaScript执行代码的时候遇到这些操作,如定时器,那么它会把定时的操作交给浏览器去完成,完成之后会把传入的回调函数放到一个队列当中,而这个队列就是事件队列,等到JavaScript线程中的任务完成之后,它就回来看下事件队列中有没有其他任务,有就执行,这样依次的去循环,这样的循环就叫做事件循环

宏任务、微任务

在事件循环中并非只有一个任务队列,它维护着两个队列。

  • 宏任务队列: ajax、setTimeout、setInterval、DOM监听、UI Rendering等
  • 微任务队列:Promise的then回调、 Mutation Observer API、queueMicrotask()等

两个任务队列的优先级:

    1. main script中的代码优先执行(编写的顶层script代码)
    1. 执行任何一个宏任务之前,会去查看微任务队列中是否还有任务没有执行完
    • 在执行宏任务之前,必须保证微任务队列是空的
    • 如果微任务队列不为空,那么就先执行完微任务队列中的任务(回调)