js同步 異步 運行機制

需要知道的那些事：

1.JS是單線程的（為什么？因為能提高效率。作為瀏覽器腳本語言，js的主要用途是與用戶互動，操作DOM。而這也就決定它只能為單線程，否則會帶來很復雜的同步問題），也就是說無法同時執行好幾段代碼，都是從上往下一句一句的執行，前面的代碼要先於后面的代碼一步被執行。如：

1 var a=12;
2 var b=15;//js在運行的時候，先執行把12賦值給a的操作，再執行把15賦值給b的操作

2.同步VS異步

同步：在同一時間，你只能做一件事情，即使這件事情會花費很長時間，但依舊需要你堅守在那里直到事情處理完畢；

異步：你在做一件事情時，因為這件事情會花費很長時間，在這等待過程中你可以先去處理其他事情，等這件事輪到你的時候再過來處理她即可。

差別：在於這條流水線上各個流程的執行順序不同。

setTimeOut(定時器)VSsetTimeInterval(間隔定時器)

在js當中最基礎的異步操作就是setTimeOut()以及setTimeInterval()了。

1.setTimeOut()方法用於在指定的毫秒數后執行某些操作；

//3秒后彈出“Hello”
var myVar;
 
function myFunction() {
    myVar = setTimeout(alertFunc, 3000);
}
 
function alertFunc() {
    alert("Hello!");
}

2.API:

var id = setTimeout(fn,timer);
      //fn是執行函數
      //timer間隔時間
      //返回一個id值，在fn未觸發之前，可以通過clearTimeout(id)清除，從而不執行fn
      clearTimeout(id);

 3.使用clearTimeOut()方法來阻止函數的執行;

4.返回一個 ID（數字），可以將這個ID傳遞給 clearTimeout() 來取消執行。

---

1.setInterval描述的是每隔多少時間執行某操作；

2.setInterval() 方法會不停地調用函數，直到 clearInterval() 被調用或窗口被關閉。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的參數；

3.API:

        var id = setInterval(fn,timer);
    //fn是要執行的函數，
    //timer是間隔時間
    //返回一個id，用於將來某個時間用clearInterval清除間隔定時器
    clearInterval(id);

區別與聯系：

1.首先從概念上來說明，setTimeout多少時間之后執行某操作，只執行一次，而setInterval每隔多少時間之后執行某操作，如果不用clearInterval清除的話，將會一直執行下去；

2.兩個方法都返回一個id值，用於清除定時器，分別是clearTimeout和clearInterval；

3.再次從性能上來說，setTimeout的性能是要優於setInterval的；

4.setTimeout和setInterval都不能保證到了時間點一定會執行,如：setTimeout(fn,5000),並不能保證5s之后一定能執行fn。這得取決於當前js線程隊列里面還有沒有其他待處理隊列，如果剛好沒有的話，那么就能剛好執行，如果當前線程里面已經有了其它待處理隊列正在執行，那么需要排隊，等到javascript線程空閑的時候才會執行定時器；

5.setTimeout是等待循環的操作執行完成之后，才繼續在間隔時間之后再把循環操作添加到javascript的線程里面，而setInterval是不等待的，它從來不管放在線程里面循環操作有沒有執行完成，反正到點就會把循環操作添加到javascript線程隊列里面；

6.能用setInterval實現的操作，一定能用setTimeout來實現。

任務隊列:

1.是一個事件的隊列或者消息的隊列。

2.所有任務都是在主線程上執行，形成一個執行棧(execution context stack);

3.執行完js主線程的代碼才會去看瀏覽器任務隊列中的事件，再執行js代碼中該事件對應的代碼；

4.任務隊列里放的是ajax這類的任務，是交給瀏覽器發起HTTP請求去執行的，當有了返回結果就會在任務隊列中增加一個事件表示該ajax請求已經返回了結果，任務隊列里的任務和js主線程是同時執行的。 不影響js是單線程的這個結論，只能說瀏覽器還會提供接口來供js

實現異步操作；

5.一旦執行棧中所有同步任務執行完畢，系統會自動讀取“任務隊列”中的看看有什么事件，那些對應的異步任務，於是結束等待狀態，進入執行棧，開始執行；

6.主線程不斷重復上面的第5步（只要主線程空了，就會讀取任務隊列，這個過程會不斷重復，這也就是js的運行機制）。