《理解JS 事件迴圈機制》

從面試題了解事件迴圈機制：

第一道：

//請寫出輸出內容
async function async1() 
async function async2() 
console.log('script start');
settimeout(function() , 0)
async1();
new promise(function(resolve) ).then(function() );
console.log('script end');

第二道：

async function async1() 
async function async2() ).then(function() );
}console.log('script start');
settimeout(function() , 0)
async1();
new promise(function(resolve) ).then(function() );
console.log('script end');

第三道：

async function async1() ,0)
}async function async2() ,0)
}console.log('script start');
settimeout(function() , 0)
async1();
new promise(function(resolve) ).then(function() );
console.log('script end');

第四道：

async function a1 () 
async function a2 () 
console.log('script start')
settimeout(() => , 0)
promise.resolve().then(() => )
a1()
let promise2 = new promise((resolve) => )
promise2.then((res) => )
})console.log('script end')

第五道：

settimeout(function(),0);
new promise(function(resolve,reject),0)
}).then(function()).then(function());
process.nexttick(function());
console.log(6);

如果能正確答出上面題的輸出內容，並能給予背後原理的解釋，那證明讀者對於js中事件迴圈機制了解得挺深入的哦~

想要了解js中的事件迴圈機制，咱們需要了解如下內容：

說明：1、js執行緒負責處理js**，當遇到一些非同步操作的時候，則將這些非同步事件移交給web apis處理，自己則繼續往下執行

2、web apis執行緒將接收到的事件按照一定的規則新增到任務佇列中，巨集事件新增到巨集任務佇列中，微事件新增到微任務佇列中

3、js執行緒處理完當前的所有任務以後（執行棧為空）,它會先去微任務佇列中獲取事件，並將微任務佇列中按照先進先執行的順序一件件執行完畢，直到微任務隊列為空後，再去巨集任務佇列中取出乙個事件執行

（每次取完乙個巨集任務佇列中的事件執行完畢後，都先檢查微任務佇列）

4、然後不斷迴圈第三步。

源**：

async function async1() 
async function async2()

其實，根據await關鍵字的作用，會將後面的內容包裝成promise，然後應該是如下模樣：

async function async1()).then(()=>)
}

如下為開頭面試題答案：

第一道：

script start async1 start async2 promise1 script end async1 end promise2 settimeout

第二道：

script start async1 start promise1 promise3 script end promise2 async1 end promise4 settimeout

第三道：

script start async1 start promise1 script end promise2 settimeout3 settimeout2 settimeout1

第四道：

script start a1 start a2promise2 script end promise1 a1 end promise2.then promise3 settimeout

第五道：

//輸出的是 2 6 5 1 3 4 //區別在於promise的構造中，沒有同步的resolve ，因此promise.then在當前的執行佇列中是不存在的，只有promise從pending轉移到resolve，才會有then方法，而這個resolve是在乙個settimout時間中完成的，因此3,4最後輸出。

巨人肩膀：

談談event loop中的job queue

事件迴圈（event loop）以及非同步執行順序

js事件迴圈機制

1 所有同步任務都在主線程上執行，形成乙個執行棧 execution context stack 2 主線程之外，還存在乙個任務佇列 task queue 只要非同步任務有了執行結果，就在任務佇列之中放置乙個事件。3 一旦執行棧中的所有同步任務執行完畢，系統就會讀取任務佇列看看裡面有哪...

JS 事件迴圈機制（Event Loop）

js事件迴圈機制，最常用到的地方應該是做面試題，經常給出一段讓你寫出console.log 順序，很傷腦經，死記題目過不久又忘了。了解js事件迴圈機制之後，可以很輕鬆的解決這類題目。js是單執行緒模式，但是又經常聽到非同步多執行緒的概念，js中的非同步多執行緒由事件迴圈機制現的事件迴...

js 事件迴圈機制 EventLoop

js 的非阻塞i o 就是由事件迴圈機制實現的眾所周知 js是單執行緒的也就是上乙個任務完成後才能開始新的任務那js碰到ajxa和定時器 promise這些非同步任務怎麼辦那？這時候就出現了事件佇列。js的主要執行棧稱為主棧用ajax舉例執行的時候如果遇到ajax怎麼辦，ajax事件的實...

《理解JS 事件迴圈機制》

js事件迴圈機制

JS 事件迴圈機制（Event Loop）

js 事件迴圈機制 EventLoop

相關推薦