終於理解了事件迴圈和任務佇列,怎麼說呢,有了es5的promise後,需要我重新思考事件的執行順序以及機制。
console.log(1);
const p = new promise((resolve, reject) => ));
$.get("", function (t) )
let tiemr1 = settimeout(() => , 5);
console.log("定時器timer1與網路請求get1競爭:");
const time = date.now();
if (time % 2 == 0) else
console.log(7);
}, 10);
console.log(2)
})console.log(3)
p.then(
value => ,
reason =>
)promise.resolve().then(() => );
console.log(4);
結果:
js**是單執行緒的,執行的機制是:
(1)js是單執行緒的,自上而下逐行執行
(2)當遇到promise的建構函式的時候,它的處理函式是立即執行的,所以該處理函式內部也是直接執行的
(3)當遇到定時器或ajax網路請求的時候,等到達條件時,將他們的回到函式,新增到任務佇列中。比如:定時器是由瀏覽器幫忙計時的,當到達計時的條件後,將定時器內的處理函式新增到任務佇列中(巨集任務還在執行,瀏覽器會幫忙計時,到達實踐後將處理函式新增到任務佇列中,好比巨集任務執行的總時間是100ms,而定時器的時間是10ms,那麼在定時器開啟後的10ms,會將事件新增到任務佇列中,當100ms的巨集任務執行完後,才會依次執行任務佇列中的每個事件)。ajax網路請求的時候,通過網路獲取到資料的時候,將處理函式新增到任務佇列中。所以這個事件是要競爭的,誰先達到條件誰先新增到任務佇列中。
(4)當遇到promise微任務的時候,比如promise.resolve().then()方法或者promise物件的then方法,這是微任務,新增到微任務佇列,當然也是按順序新增到微任務佇列的。
(5)當巨集任務執行結束後,一次性按順序將微任務佇列中的事件執行
(6)然後開始執行任務佇列中的任務,先執行任務佇列中的第乙個任務,該任務的執行也是按上述的方式,微任務新增到微任務佇列中,定時器和ajax事件新增到之前說的那個任務佇列中,繼續執行下去
注意:所有的定時器和ajax這種非同步的事件,當達到條件後新增任務佇列中,進行事件執行先後的排序。所以對於非同步事件,我們不能看他什麼時候開啟的,而是什麼時候達到新增條件的,將其新增到任務佇列中。
上面**執行的思維導圖:
任務列隊和event loop(事件迴圈)
1.所有的同步任務都在主線程上執行,行成乙個執行棧。2.除了主線程之外,還存在乙個任務列隊,只要非同步任務有了執行結果,就在任務列隊中植入乙個時間標記。3.主線程完成所有任務 執行棧清空 就會讀取任務列隊,先執行微任務佇列在執行巨集任務佇列。4.重複上面三步。只要主線程空了,就會讀取任務列隊,這就是...
事件迴圈2(微任務 和巨集任務)
js是單執行緒,一次只能執行乙個任務,當有乙個耗時很長時,有乙個在後面等待,會造成堵塞,非同步的目的就是處理堵塞,提公升效能。一 promise物件 promise呼叫內部函式。promise有三種物件 1.pending 待定,未初始化 2.resolved 非同步成功 3.rejected 非同...
事件迴圈 巨集任務 微任務
在js中我們經常會需要 同時 進行多項工作,例如 定時器 事件 非同步資料互動等,那麼js是如何管理這些任務的,又是如何確定他們的執行順序的?首先,所有的語言都擁有併發模型的概念,也就是說多個任務如何同時執行,大部分語言支援多執行緒執行,js擁有所有語言中最簡單的併發模型 js使用單執行緒的 事件迴...