麻豆黑色丝袜jk制服福利网站-麻豆精品传媒视频观看-麻豆精品传媒一二三区在线视频-麻豆精选传媒4区2021-在线视频99-在线视频a

千鋒教育-做有情懷、有良心、有品質的職業教育機構

手機站
千鋒教育

千鋒學習站 | 隨時隨地免費學

千鋒教育

掃一掃進入千鋒手機站

領取全套視頻
千鋒教育

關注千鋒學習站小程序
隨時隨地免費學習課程

當前位置:首頁  >  技術干貨  > 如何理解JS的單線程?

如何理解JS的單線程?

來源:千鋒教育
發布人:wjy
時間: 2022-08-11 13:56:16 1660197376

  JS本質是單線程的。也就是說,它并不能像JAVA語言那樣,兩個線程并發執行。

  但我們平時看到的JS,分明是可以同時運作很多任務的,這又是怎么回事呢?

  首先,JS的代碼,大致分為兩類,同步代碼和異步代碼。

  console.log(1)

  console.log(2)

  console.log(3)

  這是典型的同步代碼,編寫順序就是執行順序。

  JS引擎的主線程負責執行代碼,由于只有這一個線程,執行當然是同步的,即按照順序來。

  另外,還有一個叫做任務隊列的東西,所有的異步代碼都是從隊列當中來。

如何理解JS的單線程1

  

 

 

  所以實際上我們會發現,JS根本不可能同時執行兩個任務,本質上還是單線程。

  在JS中,所謂的異步任務,有三種:

  第一, 鼠標鍵盤事件觸發,例如onclick、onkeydown等等

  第二, 網絡事件觸發,例如onload、onerror等等

  第三, 定時器,例如setTimeout、setInterval

  因為這些任務的發生都不是在當下,而是過段時間以后再執行。因此時間不可控,你不能因為5秒后要執行一個函數,就讓主線程閑置5秒什么都不干吧?所以你只能繼續執行后續的同步代碼。而當你單擊鼠標或滾動窗口時,主線程可能正在執行其它代碼,忙著呢!沒工夫處理,因此,事件觸發線程就負責來接收這個事件,并把要執行的任務暫時保存在任務隊列當中。等主線程把手里的同步代碼執行完,就立刻會向任務隊列提取最新的任務。

  這也就解釋了為什么我們總把JS的異步函數叫做回調了,因為真的不是馬上執行,而是回頭再調的!

  我們來看個簡單的例子:

  setTimeout(“console.log(2)”, 0);

  console.log(1);

  反復執行這段代碼,結果都是先打印1再打印2

  因為,setTimeout是個異步任務,第二個參數真正的含義是,在0毫秒之后,將代碼插入任務隊列,而不是在0毫秒之后執行。

  當插入任務隊列后,主線程會繼續執行后續的代碼,也就是打印結果1,如果此時當前的同步代碼已經執行完畢,則主線程立刻會從任務隊列中取出最新任務執行。再打印結果2。

  平時我們使用定時器,時間往往不準確,就是因為在加入任務隊列時,前面可能已經有好多任務在排隊了,你明明寫了80ms的延遲,可是卻等了100ms才出現結果。

  同時,我們也理解了,為什么setInterval的時間間隔不能設為0,一般情況下瀏覽器允許的最小值為16ms,因為如果設成0的話,對于瀏覽器來講,壓力簡直太大了,定時器觸發線程會玩命兒的往隊列中插入任務,而不是完成一個再插入一個。

  我們再看一個關于ajax的例子

  var req = newXMLHttpRequest();

  req.open(“get“, “http://xxxxxxxx“);

  req.onload =function(){......}

  req.send();

  send方法和onload可以交換順序嗎?

  實際上完全沒有影響。

  為什么說send方法和onload交換順序完全沒有問題呢?

  因為send是一個異步方法,也就是當我們把代碼寫成這樣:

  var req = newXMLHttpRequest();

  req.open(“get“, “http://xxxxxxxx“);

  req.send();

  req.onload =function(){......}

  主線程在send方法執行時,由于是異步方法,因此它不會立刻執行,而是存入任務隊列,然后繼續向下執行代碼,添加onload事件。所以send方法無論如何都會在添加onload事件之后再執行,因此順序顛倒是無關要緊的。不過需要提醒的是,onload事件在添加時,并不會加入任務隊列,而是通知網絡事件觸發線程,一旦網絡請求結束,事件被觸發,該線程便會立刻向任務隊列中加入這個onload函數,從而完成回調。

  最后我們用一個完整的例子來觀察一下JS如何以單線程執行代碼

  setTimeout( a, 0);

  setInterval( b,500);

  for(......){

  //假設循環執行了大量操作,花費時間1000ms

  //而在for循環執行期間,用戶通過鼠標觸發了一次單擊事件

  }

  console.log(123);

  setInterval(c,250);

  那么任務隊列的情況如下:

如何理解JS的單線程2

 

  我們按順序來解釋一下:

  任務a,由于延遲為0,則以最短時間立即加入隊列。

  任務b,等待500ms后,加入隊列,此時for循環運行過半

  任務click,由于發生在for循環執行期間,所以此時出現

  任務b,for循環結束時,又過了500ms,因此加入b

  任務c,從for循環結束時開始計時,250ms后加入c

  任務c,因為又過了250ms

  任務b,與此同時,距離上次加入b間隔為500ms,因此加入b

  往后,每出現兩次c,出現一次b

  OK!今天的課到此結束!

  更多關于html5培訓的問題,歡迎咨詢千鋒教育在線名師,如果想要了解我們的師資、課程、項目實操的話可以點擊咨詢課程顧問,獲取試聽資格來試聽我們的課程,在線零距離接觸千鋒教育大咖名師,讓你輕松從入門到精通。

tags:
聲明:本站稿件版權均屬千鋒教育所有,未經許可不得擅自轉載。
10年以上業內強師集結,手把手帶你蛻變精英
請您保持通訊暢通,專屬學習老師24小時內將與您1V1溝通
免費領取
今日已有369人領取成功
劉同學 138****2860 剛剛成功領取
王同學 131****2015 剛剛成功領取
張同學 133****4652 剛剛成功領取
李同學 135****8607 剛剛成功領取
楊同學 132****5667 剛剛成功領取
岳同學 134****6652 剛剛成功領取
梁同學 157****2950 剛剛成功領取
劉同學 189****1015 剛剛成功領取
張同學 155****4678 剛剛成功領取
鄒同學 139****2907 剛剛成功領取
董同學 138****2867 剛剛成功領取
周同學 136****3602 剛剛成功領取
相關推薦HOT
主站蜘蛛池模板: 8x在线播放| 免费日韩三级电影| 国产男女猛烈无遮挡免费视频| 青草青草久热精品视频在线观看| 四虎1515hh丶com| 一级毛片不卡| 国产馆在线观看免费的| 日本哺乳期xxxx| 国产精品久久久| 欧美午夜影院| 国产日韩美国成人| 在线观看免费毛片| 伦理一区二区三区| 韩国理伦大片三女教师| 日韩手机视频| 两根硕大一起挤进小h| 天天在线天天看成人免费视频| 波多野结衣一区二区三区88| 亚洲国产高清在线精品一区| avtt在线观看| 国产区图片区小说区亚洲区| 波多野结衣bt| 日韩在线一区二区三区免费视频| 99久久精品免费看国产| 91蜜桃在线观看| 看看屋在线看看电影| 免费大片黄在线观看| 黄色一级片日本| 经典三级四虎在线观看| 日韩国产精品欧美一区二区| 欧美乱大交| 夜夜操天天操| 伊人久久精品久久亚洲一区| 国产特级毛片aaaaaaa高清| 亚洲不卡在线观看| 波多野结衣电影区一区二区三区| 亚洲妇熟xxxx妇色黄| 啊轻点灬大ji巴黑人太粗| 一边摸一边爽一边叫床视频| 俺也去第四色| 国自产拍亚洲免费视频|