JS事件循环(Event Loop)

单线程
Javascript 是一个单线程语言，意思就是Javascript 一次只能做一件事情，等上一件事情完成才能執行下一件事情。
那Javascript为什么可以做到非同步的效果呢？

• Web APIs
  当我们撰写网页程式码时候，有很多常用方便的功能浏览器已经替我们提供好了，他们统称叫做Web APIs。
  例如：Dom物件的操作、Ajax相关的XMLHTTPRequest、Fetch API，以及时常被使用到的setTimeout等等。

在呼叫Web APIs时，很常会使用非同步的方式处理。

1. setTimeout

console .log( 'a' );
setTimeout ( function () { console .log( 'b in setTimeout' ); }, 0 );
console .log( 'c' );

上面的代码我们已经知道会打印出:

a 
c 
b in setTimeout

那么为什么会出现这个结果呢？
Event Loop

Event Loop示意图

Call Stack会呼叫Web APIs，Web APIs等到完成后，也就是说等待的过程是Web APIs内完成的，会将完成后要执行的callback function丢到Callback Queue内排队，等待Call Stack若是空的状态的话，就可以将要执行的callback function在Call Stack执行
当上面代码执行时，会执行以下流程：
step1: 当执行到第2 行的时候，会将这段程式码移动到Web APIs 的区块内，等待0 秒

step2: 将setTimeout 的Callback Function 放入Callback Queue 内排队

step3: 若Call Stack 为空的状态，将Callback Queue 的Callback Function 推到Call Stack 执行