javascript运行机制

个人理解

javascript单线程

• 为啥是单线程呢？因为诞生之初，设计这个语言的人是为了与浏览器交互(处理DOM)专门设计的。假如是多线程的话，如果要处理DOM元素，有多个任务同时处理同一个DOM，就会有冲突了。

事件循环机制

• 首先，js分为同步任务和异步任务
• 同步任务会放入一个执行栈中
• 异步任务会放入任务队列

• 当执行栈中的任务全部执行完成之后，会陆续调用任务队列中的任务（异步的回调函数）

  
  image.png
• 同步和异步任务分别进入不同的执行"场所"，同步的进入主线程，异步的进入Event Table并注册函数。
• 当指定的事情完成时，Event Table会将这个函数移入Event Queue。
• 主线程内的任务执行完毕为空，会去Event Queue读取对应的函数，进入主线程执行。
• 上述过程会不断重复，也就是常说的事件循环。

异步任务

异步任务分为macro-task和micro-task

macro-task:

• setInterval()
• setTimeout()

micro-task:

• new Promise()
• new MutaionObserver()

在一个事件循环中，异步事件返回结果后会被放到一个任务队列中。然而，根据这个异步事件的类型，这个事件实际上会被对应的宏任务队列或者微任务队列中去。并且在当前执行栈为空的时候，主线程会 查看微任务队列是否有事件存在。如果不存在，那么再去宏任务队列中取出一个事件并把对应的回到加入当前执行栈；如果存在，则会依次执行队列中事件对应的回调，直到微任务队列为空，然后去宏任务队列中取出最前面的一个事件，把对应的回调加入当前执行栈...如此反复，进入循环。

我们只需记住当当前执行栈执行完毕时会立刻先处理所有微任务队列中的事件，然后再去宏任务队列中取出一个事件。同一次事件循环中，微任务永远在宏任务之前执行。