js執行引擎與瀏覽器內核分析

js的引擎是單線程執行的,也就是說在js的進程時間線中同一時間只有一個線程在執行,PS:如果不瞭解單線程與多線程的區別建議看看《現代操作系統》裏面有很好的說明。很多人會有疑問,如果是單線程的那麼js中是怎麼實現onclick、onload、onreadstatechange、setTimeOut等事件的,答案就是瀏覽器提供。請看下面關於瀏覽器內核的圖:

可以看到瀏覽器把js執行引擎做爲瀏覽器內核裏面的一個線程,當用戶在瀏覽器單擊,如果我們添加了onclick時間,那麼瀏覽器幫助我們偵聽了這個事件,因爲我們(o代表DOM或者BOM對象)o.οnclick=function(){};指定對o對象執行onclick時候(即用戶點擊頁面中的元素),瀏覽器事件觸發線程會爲我們把指定的事件處理程序添加到js引擎當中。···········細心的人會想,就這樣完了麼???其實,還涉及到比較複雜的過程,就是js的進程時間線,把指定的事件處理程序(如剛剛的function(){}這代碼),實際上我們單擊頁面中的元素對象(此例子中的o),相當於這樣子o.onclick()調用,調用的代碼就是執行的那段(function(){.....z這裏面的代碼······});然後點擊o,其實只是把這段代碼添加到了js的代碼隊列裏面,其實可能還沒有執行。當js進程時間線爲空閒的時候,這段代碼纔會真正的執行。

關於js的進程時間線,我特意畫了下面這個圖,希望有助於各位理解:

注:handleClick()爲我們指定的onclick()事件處理程序代碼

從而我們可以得出一個結論:js事件處理機制是異步的,即添加進代碼隊列裏面的時刻與代碼實際執行時間可能存在一定時間差。

其實,返觀定時器、HTTP異步,其實也就是這麼一種處理的模式。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章