国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

JavaScript的event-loop

aboutU / 561人閱讀

摘要：從誕生之日起就是一門單線程的非阻塞的腳本語言。這意味著這些線程實際上應屬于主線程的子線程。所以嚴格來講這些線程并沒有完整的功能，也因此這項技術并非改變了語言的單線程本質。函數執行棧和事件隊列

瀏覽器渲染

從耗時的角度，瀏覽器請求、加載、渲染一個頁面，時間花在下面五件事情上：
1.DNS 查詢
2.TCP 連接
3.HTTP 請求即響應
4.服務器響應
5.客戶端渲染

這里重點討論第五個部分，即瀏覽器對內容的渲染，這一部分（渲染樹構建，布局和繪制），又可以分為下面的五個部分。

1.處理 HTML 標記并構建 DOM 樹。
2.處理 CSS 標記并構建 CSSOM 樹。
3.將 DOM 與 CSSOM 合并成一個渲染樹。
4.根據渲染樹來布局，以計算每個節點的幾何信息。
5.將各個節點繪制到屏幕上。

這些并不是本文正文，只是說在完成以上過程之后，整個頁面就已經出來了，這個時候瀏覽器是否就已經處于空閑狀態了呢（不考慮動畫、交互等處理）？接下來就是本文的重點了。

堆、棧、隊列

了解重點之前我們先了解一點簡單的基礎知識，堆、棧、隊列；

堆 
對象被分配在一個堆中，即用以表示一個大部分非結構化的內存區域。

這是在程序運行時需要給對new操作產生的對象分配存儲空間，是一個沒有特別限制的存儲空間。

棧 
函數調用形成一個棧幀;

棧的特點：先進后出(First in, last out)函數執行棧過程；可以看成是每次函數first運行時，將函數入棧，此時函數中的其他運行函數(second函數)需要再次入棧，執行完該second函數之后，該second函數將會出棧，繼而完成first的執行，執行完成后，first將會出棧；

隊列

隊列是一種和棧不一樣的數據結構，類似管道，先進入的將會現出來，和棧是相反的。

event-loop 
javascript從誕生之日起就是一門單線程的非阻塞的腳本語言。這是由其最初的用途來決定的：與瀏覽器交互。
單線程意味著，javascript代碼在執行的任何時候，都只有一個主線程來處理所有的任務。
而非阻塞則是當代碼需要進行一項異步任務（無法立刻返回結果，需要花一定時間才能返回的任務，如I/O事件）的時候，主線程會掛起（pending）這個任務，然后在異步任務返回結果的時候再根據一定規則去執行相應的回調。
單線程是必要的，也是javascript這門語言的基石，原因之一在其最初也是最主要的執行環境——瀏覽器中，我們需要進行各種各樣的dom操作。試想一下 如果javascript是多線程的，那么當兩個線程同時對dom進行一項操作，例如一個向其添加事件，而另一個刪除了這個dom，此時該如何處理呢？因此，為了保證不會 發生類似于這個例子中的情景，javascript選擇只用一個主線程來執行代碼，這樣就保證了程序執行的一致性。
當然，現如今人們也意識到，單線程在保證了執行順序的同時也限制了javascript的效率，因此開發出了web worker技術。這項技術號稱讓javascript成為一門多線程語言。
然而，使用web worker技術開的多線程有著諸多限制，例如：所有新線程都受主線程的完全控制，不能獨立執行。這意味著這些“線程” 實際上應屬于主線程的子線程。另外，這些子線程并沒有執行I/O操作的權限，只能為主線程分擔一些諸如計算等任務。所以嚴格來講這些線程并沒有完整的功能，也因此這項技術并非改變了javascript語言的單線程本質。
可以預見，未來的javascript也會一直是一門單線程的語言。

那么為了能夠很好地提高的腳本的效率，故而設計的時候有一個非常有趣的特性是事件循環模型，與許多其他語言不同，它永不阻塞。 處理 I/O 通常通過事件和回調來執行，所以當一個應用正等待IndexedDB查詢返回或者一個 XHR 請求返回時，它仍然可以處理其它事情，如用戶輸入。

macro task與micro task

首先執行script，script被稱為全局任務，也屬于macrotask;

當macrotask執行完以下，執行所有的微任務；

微任務全部執行完，再取任務隊列中的一個宏任務執行。

宏任務包括：script, setTimeout, setInterval, setImmediate, I/O，UI rendering，requestAnimationFrame
微任務包括：process.nextTick(node api), 原生Promise(有些實現的promise將then方法放到了宏任務中),Object.observe(已廢棄), MutationObserver

執行順序

所有的宏任務放在一個宏任務隊列（即任務隊列），處理完一個宏任務(從sccript開始)，將微任務隊列（包含當時所有的微任務）壓入任務隊列（宏任務隊列）并執行，之后再取下一個任務隊列（宏任務）中的宏任務。

https://juejin.im/post/5b6d58...

https://github.com/ccforward/... 【函數執行棧和事件隊列】

https://zhuanlan.zhihu.com/p/...

https://jakearchibald.com/201...

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/97048.html

相關文章

  • 徹底搞懂瀏覽器Event-loop

    摘要：檢查宏任務隊列，發現有的回調函數立即執行回調函數輸出。接著遇到它的作用是在后將回調函數放到宏任務隊列中這個任務在再下一次的事件循環中執行。 為什么會寫這篇博文呢？ 前段時間，和頭條的小伙伴聊天問頭條面試前端會問哪些問題，他稱如果是他面試的話，event-loop肯定是要問的。那天聊了蠻多，event-loop算是給我留下了很深的印象，原因很簡單，因為之前我從未深入了解過，如果是面試的時...

    source 評論0 收藏0

  • 理解Event-Loop

    摘要：回調函數任務完成的時候，需要執行哪段代碼來處理呢當然是回調函數了。事件處理器和回調函數類似。但是特定的事件處理器在瀏覽器進入異步事件驅動階段時就會針對特定的事件注冊。當事件對象返回到執行線程時，事件處理器也會同時進入執行棧中執行。 Event Loop（事件輪詢）機制是一個經常把人搞暈的東東。我不敢說我完全明白，只是在此談談我的淺見。 事件的處理 瀏覽器是一個事件驅動（event-dr...

    blair 評論0 收藏0

  • 淺析 event-loop 事件輪詢

    摘要：如果執行的準備時間大于了，因為執行同步代碼后，定時器的回調已經被放入隊列，所以會先執行隊列。 showImg(https://segmentfault.com/img/remote/1460000018998584); 閱讀原文 瀏覽器中的事件輪詢 JavaScript 是一門單線程語言，之所以說是單線程，是因為在瀏覽器中，如果是多線程，并且兩個線程同時操作了同一個 Dom 元素，...

    2501207950 評論0 收藏0

  • Event-loop事件循環

    摘要：事件循環首先來看一段代碼運行結果是先輸出，然后大概好幾秒大于一秒以后依次輸出，。原因就在以下這部分代碼中原因就是這部分循環的代碼執行過程超過了秒。而這個循環是放在里面的。 Event-loop 事件循環 首先來看一段代碼 function fn(){ console.log(1) setTimeout(() => { console.log(2) }, 1000) ...

    MingjunYang 評論0 收藏0

  • 微任務、宏任務與Event-Loop

    摘要：所以本來快輪到你來辦理業務，會因為老大爺臨時添加的理財業務而往后推。在執行完同步代碼與微任務以后，這時繼續向后查找有木有宏任務。所以輸出了第二次，等到這兩次都執行完畢后才會去檢查有沒有微任務有沒有宏任務。 首先，JavaScript是一個單線程的腳本語言。 所以就是說在一行代碼執行的過程中，必然不會存在同時執行的另一行代碼，就像使用alert()以后進行瘋狂console.log，如...

    Nekron 評論0 收藏0

發表評論

0條評論

aboutU

男|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<