javascript事件循環(huán)event loop的簡單模型解釋與應用分析
本文實例講述了javascript事件循環(huán)event loop的簡單模型解釋與應用.分享給大家供大家參考，具體如下：
js是單線程的，但是event loop的出現(xiàn)，使得js擁有可以處理高并發(fā)的性能。那么怎么理解event loop呢？網(wǎng)上百度一堆文章，什么heap，stack，micro queue，macro queue，讓初學者直接懵掉。這里采用很通俗的理解方式介紹下event loop.
event loop顧名思義是事件循環(huán)，既然是循環(huán)，那循環(huán)的是什么呢？
對于一個js文件，
1，執(zhí)行當前執(zhí)行上下文（初次是全局作用域）的所有同步任務，有異步任務的透出
2，執(zhí)行任務隊列里第一個異步任務，
3，執(zhí)行當前異步任務執(zhí)行上下文的所有同步任務，有異步任務透出
從上面的執(zhí)行順序可以清楚的看到循環(huán)執(zhí)行的是什么，event loop循環(huán)中的循環(huán)任務是指：
執(zhí)行某個執(zhí)行上下文的所有同步任務，透出異步任務
看一個簡單實例：
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <meta name='viewport' content='width=device-width, initial-scale=1.0'> <meta http-equiv='X-UA-Compatible' content='ie=edge'> <title>event-loop-test</title></head><body> <script> setTimeout(function(){ console.log(’測試定時事件循環(huán)’) new Promise(function(resolve,reject){resolve(’內(nèi)層數(shù)據(jù)’) }).then(function(data){console.log(data) }) console.log(’測試測試測試111’) for(var i = 0; i<5000; i++){console.log(’異步任務中的耗時同步任務’) } setTimeout(function(){console.log(22222) //這里透出的異步任務會在testPromise之后，在上面的for循環(huán)執(zhí)行過后，testPromise已經(jīng)透出異步任務，放到隊列中 },0) },0) for(var i = 0; i<5000; i++){ console.log(’測試event loop’) } for(var i = 0; i<5000; i++){ console.log(’測試event loop2’) } var testPromise = new Promise(function(resolve,reject){ console.log(’直接測試promiseneibu’) setTimeout(function(){resolve(’promise測試’)console.log(’promise內(nèi)部的console’) },10) }) testPromise.then(function(data){ console.log(data) }) console.log(’我是直接運行的’) </script></body></html>
由上面的實例和分析可以得出：
任務隊列中的異步任務透出和循環(huán)層級是沒有關系的，任務隊列中的異步任務是根據(jù)透出先后順序排列的
建立一個簡單模型：
也可以理解為：
感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼運行效果。
更多關于JavaScript相關內(nèi)容感興趣的讀者可查看本站專題：《JavaScript操作DOM技巧總結》、《JavaScript頁面元素操作技巧總結》、《JavaScript事件相關操作與技巧大全》、《JavaScript查找算法技巧總結》、《JavaScript數(shù)據(jù)結構與算法技巧總結》、《JavaScript遍歷算法與技巧總結》及《JavaScript錯誤與調(diào)試技巧總結》
希望本文所述對大家JavaScript程序設計有所幫助。
相關文章：
網(wǎng)公網(wǎng)安備