這篇文章主要介紹了JavaScript中EventLoop有什么用,具有一定借鑒價(jià)值,感興趣的朋友可以參考下,希望大家閱讀完這篇文章之后大有收獲,下面讓小編帶著大家一起了解一下。
創(chuàng)新互聯(lián)堅(jiān)持“要么做到,要么別承諾”的工作理念,服務(wù)領(lǐng)域包括:成都網(wǎng)站設(shè)計(jì)、網(wǎng)站建設(shè)、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù),滿足客戶于互聯(lián)網(wǎng)時(shí)代的藤縣網(wǎng)站設(shè)計(jì)、移動(dòng)媒體設(shè)計(jì)的需求,幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴!想象下,比如瀏覽器在運(yùn)行一個(gè)復(fù)雜的圖像轉(zhuǎn)換算法,因?yàn)槭菃尉€程的,所以此時(shí)瀏覽器進(jìn)程被阻塞了,不能進(jìn)行界面渲染,也不能運(yùn)行其他代碼,你的應(yīng)用界面會(huì)失去和用戶的交互。
這一般情況下還不會(huì)有大問(wèn)題,但是當(dāng)瀏覽器在同時(shí)運(yùn)行多個(gè)類似的算法時(shí),這個(gè)問(wèn)題就很嚴(yán)重了。
有一定經(jīng)驗(yàn)js開發(fā)人員大多都理解代碼的異步執(zhí)行,特別是ajax的使用。
// ajax(..) is some arbitrary Ajax function given by a library var response = ajax('https://example.com/api'); console.log(response); // `response` won't have the response
這里response 將不會(huì)得到你想要的結(jié)果。
而是需要像相面這樣,通過(guò) callback函數(shù)的方式,獲取結(jié)果
ajax('https://example.com/api', function(response) { console.log(response); // `response` is now available });
另外這里面提醒一下,下面的代碼, async: false永遠(yuǎn)都不是一個(gè)好主意。
// This is assuming that you're using jQuery jQuery.ajax({ url: 'https://api.example.com/endpoint', success: function(response) { // This is your callback. }, async: false // And this is a terrible idea });
通過(guò)上面的例子,我們應(yīng)該理解通過(guò) 異步 函數(shù),可以幫助我們解決 類似瀏覽器阻塞問(wèn)題。
當(dāng)然還可以通過(guò) setTimeout(callback, milliseconds)實(shí)現(xiàn)同樣的邏輯。如果你理解了異步,下面代碼執(zhí)行會(huì)輸出什么呢?
function first() { console.log('first'); } function second() { console.log('second'); } function third() { console.log('third'); } first(); setTimeout(second, 1000); // Invoke `second` after 1000ms third();
那個(gè)這下異步處理機(jī)制的原理是什么呢?這里就要引入我們的事件循環(huán)Event Loop了
Event Loop有一個(gè)簡(jiǎn)單的Job(task) - 監(jiān)視Call Stack和Callback Queue。如果調(diào)用堆棧為空,它將從隊(duì)列中取出第一個(gè)事件,并將其推送到調(diào)用堆棧,從而有效地運(yùn)行它。
這種迭代在事件循環(huán)中被稱為Tick。每個(gè)事件只是一個(gè)函數(shù)回調(diào)。
console.log('Hi'); setTimeout(function cb1() { console.log('cb1'); }, 5000); console.log('Bye');
執(zhí)行這段代碼,下面的調(diào)用棧清楚的演示了事件循環(huán)的處理流程。
請(qǐng)注意,setTimeout(...)不會(huì)自動(dòng)將您的回調(diào)放在事件循環(huán)隊(duì)列中。
它設(shè)置了一個(gè)計(jì)時(shí)器。當(dāng)計(jì)時(shí)器到期時(shí),瀏覽器將你的回調(diào)放到事件循環(huán)中,以便將來(lái)的一些tick會(huì)執(zhí)行。但是,隊(duì)列中可能還有其他事件已經(jīng)被添加了 - 您的回調(diào)將不會(huì)立即執(zhí)行。
有很多關(guān)于開始使用JavaScript中的異步代碼的文章和教程,建議您使用setTimeout(callback,0)。
現(xiàn)在你知道Event Loop是怎么做的,以及setTimeout是如何工作的。
你就能更好的理解下面的代碼
console.log('Hi'); setTimeout(function() { console.log('callback'); }, 0); console.log('Bye');
盡管等待時(shí)間設(shè)置為0 ms,但瀏覽器控制臺(tái)中的結(jié)果如下所示:
Hi
Bye
callback
感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享的“JavaScript中EventLoop有什么用”這篇文章對(duì)大家有幫助,同時(shí)也希望大家多多支持創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計(jì)公司,關(guān)注創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計(jì)公司行業(yè)資訊頻道,更多相關(guān)知識(shí)等著你來(lái)學(xué)習(xí)!
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內(nèi)外云服務(wù)器15元起步,三天無(wú)理由+7*72小時(shí)售后在線,公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、網(wǎng)站設(shè)計(jì)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì),專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。
網(wǎng)頁(yè)標(biāo)題:JavaScript中EventLoop有什么用-創(chuàng)新互聯(lián)
轉(zhuǎn)載來(lái)于:http://muchs.cn/article16/ddjgdg.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站設(shè)計(jì)公司、自適應(yīng)網(wǎng)站、軟件開發(fā)、靜態(tài)網(wǎng)站、App設(shè)計(jì)、搜索引擎優(yōu)化
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容