在說我們的事件回圈之前我們需要先知道這兩個概念：
1、什么是同步和異步
2、JS異步是怎么實作的
首先同步和異步，其實這個很很好理解，同步其實就是代碼按照我們的撰寫順序執行，那么異步呢其實就是代碼的執行順序可能會和我們的撰寫順序不一樣
JS異步是怎么實作的？
我們都知道JS是單執行緒執行語言，其實單執行緒指的是JS的主運行執行緒只有一個，并不是說整個運行環境都是單執行緒的，JS的運行環境主要是瀏覽器，那么我們的瀏覽器內核（比如chrome）不僅僅是多執行緒的還是多行程的
所以JS異步的實作靠的就是瀏覽器的多執行緒，當他遇到異步API時，就將這個任務交給對應的執行緒，當這個異步API滿足回呼條件時，對應的執行緒又通過事件觸發執行緒將這個事件放入任務佇列，然后主執行緒從任務佇列取出事件繼續執行，這個流程我們多次提到了任務佇列，這其實就是Event Loop
其實這個event loop就是我們要講的事件回圈
我們先理解一下下面這個圖
那么什么是宏任務和微任務呢
規范中規定，task分為兩大類, 分別是 Macro Task （宏任務）和 Micro Task（微任務）, 并且每個宏任務結束后, 都要清空所有的微任務,這里的 Macro Task也是我們常說的 task ，有些文章并沒有對其做區分
宏任務主要包含：script( 整體代碼)、setTimeout、setInterval、I/O、UI 互動事件、setImmediate(Node.js 環境)
微任務主要包含：Promise、MutaionObserver、process.nextTick(Node.js 環境)
setTimeout/Promise 等API便是任務源，而進入任務佇列的是由他們指定的具體執行任務，來自不同任務源的任務會進入到不同的任務佇列，其中 setTimeout 與 setInterval 是同源的，
那么我們的代碼在運行的時候，是先執行一個宏任務再清空微任務，這樣執行，那么其實任務中也有執行的優先級，比如說這里process.nextTick這個的優先級就是最高的，然后setImmediate的優先級也會比
setTimeout(fn,0)高，但是具體為什么這個就需要看我們JS的底層原理了，這里就先不述說了，
舉幾個例子吧！
console.log('script start');
setTimeout(function() {
console.log('setTimeout');
}, 0);
Promise.resolve().then(function() {
console.log('promise1');
}).then(function() {
console.log('promise2');
});
console.log('script end');
很明顯這個沒有轉彎大家就可以直接寫出答案
start end promise1 promise2 setTimeout
再來一個在node環境下運行的例子
function timer() {
setTimeout(()=>{
console.log(1);
},0)
setImmediate(()=>{
console.log(2);
})
console.log(3);
process.nextTick(()=>{
console.log(4);
})
}
那么就像我們剛剛說的那樣，這次的輸出結果是
那么通過這兩個例子，大家估計也對我們的事件回圈有了很清晰的認識啦！！！
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/344265.html
標籤：其他
上一篇：Vue基礎知識(1)