首頁  >  文章  >  web前端  >  使用JS如何實現單線程異步io回調

使用JS如何實現單線程異步io回調

亚连
亚连原創
2018-06-23 11:52:111106瀏覽

這篇文章主要分析了javascript單線程非同步io回呼的特性這個問題,希望我們整理的內容能幫助你。

我們最開始接觸javascript應該大部分是從html中的js腳本開始,但是這種看似簡單的語言稀里糊塗的用了好幾年,也沒有搞清楚它的一些原理機制,有沒有躺槍!

起碼javascript在操作dom的時候用了各種事件回調,比如按鈕,鏈接的點擊,滑鼠經過,獲取焦點等等.

在這個過程中,我們在dom上綁定一個事件回呼函數例如onclick="doCheck()" 這個過程就是給dom元素註冊了一個click 事件,並且綁定了一個事件回調函數doCheck().

當滑鼠點擊這個元素的時候,觸發了事件,馬上執行事件綁定函數並回.

再後來是接觸到jquery 的時候,大量的

$("#id").click(function(){
alert('点击事件');
});

這種jquery的語法寫的越來越多似乎已經習慣了,但是你是都留意過前面的選擇器只是選擇過濾dom節點,接著的click就是一個事件註冊,而裡面的function(){} 其實是一個參數,事件綁定函數的參數,這裡面就要求你熟悉javascript的語法了.

function在javascript中是一個對象,對象就可以指世界的萬事萬物,所以對象可以包含很多屬性,方法等.

#既然是物件,那就可以當做一個參數去傳遞,這種函數叫做高階函數.

而且這種函數沒有定義名稱對不對,當然你可以一個名稱,然後把名稱傳過來也是一樣的,但是沒有意義,因為這裡的函數對像其實是一個形參,所以我們習慣的不給這種函數起名字,這就是常說的匿名函數.

接著上面的$( "#id").click 說起,當點擊事件被觸發時,就要執行事件綁定函數.和上面直接在dom上給定onclick方法是一樣的效果.

假設瀏覽器裡有多個線程去操作腳本的話,你能想像到他的亂嗎? 線程一正要去修改元素A的value值,結果沒想到線程二已經把元素A從dom樹刪除節點,這時線程一隻好操作失敗報錯.這樣的情況是不糟透了,要么瀏覽器無維護多個線程數據的一致性,要么前端工程師自己去維護,所以......瀏覽器只有一個線程去操作dom,這樣省去了很多不必要的麻煩.

setTimeout(function(){
alert('弹出');
},300);

while(true){
	........
}

你覺得300毫秒後alert('彈出') 還有戲嗎?

沒有了,永遠沒有戲了,等待300毫秒只是騙取你的感情的.因為瀏覽器是單線程模式執行腳本.

一旦線程處於死循環模式下去執行while 語句,你的setTimeout 再也不會起任何作用了.

進而我們走入了node.js 世界,它完全保留了javascript在瀏覽器的特性,單線程異步回調,也正是因為這個特點它才是它,假如node.js 是一門同步語言,就算所有的npm套件都是c 擴充的(速度夠快吧)再快你也比不過c語言處理速度是不是,那麼node.js可能還沒出世就已經被php鄙視了.

正是因為它的非同步回調IO,更能提高他的效率,讓我想起以前學校的一種快餐店和學校食堂的對比情況:

食堂是所有學生拿著盤子在窗口排成一字型隊,打飯的妹妹一個一個盛好了,挨個端上飯走了.這是同步處理結果.

學校快餐店也是學生排隊點餐,但是點完餐拿上你的呼叫器就可以離開找位置去了.這樣單位時間內服務員可以為很多人提供服務,而且點好餐的同學可以找位置做自己其他事情,而不用傻傻地站到窗口等飯,直到你的飯出來的那一剎那,伺服器會根據單號按下編碼,這時你桌上的呼叫器會響起,你去取餐就好了.這是異步處理.那個呼叫器響起就是觸發事件.

#單線程可以減少多線程之間狀態切換引起的資源浪費和維護困難,當然也有專門的第三方包來支持多核多線程的情景,你可以自己權衡.

上面是我整理給大家的,希望今後對大家有幫助。

相關文章:

詳細解讀react-navigation的導覽使用

在javascript中詳細解讀Function函數(詳細教學)

使用AngularJS2與D3.js整合如何實現自訂視覺化

以上是使用JS如何實現單線程異步io回調的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn