iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 8
0
Modern Web

JavaScript 從零開始系列 第 8

JavaScript 從零開始 - Day8- 執行緒與同步、非同步

  • 分享至 

  • xImage
  •  

core

有單執行緒就有多執行緒,多執行緒就是可以在同個時間執行多個函式,可是 JavaScript 是單執行緒的程式語言,所以若給予一個以上的函式,會分開且按照順序執行,
例如:

function A() {
  console.log('work A');
}

function B() {
  console.log('work B');
}

function C() {
  console.log('work C');
}

function D() {
  A();
  B();
  C();
}
D();

但 JS 有同步非同步(Async)可以使用。而單執行緒是對於系統的執行,非同步是對於程式語言本身來執行,上方例子就是一個同步的範例,會按照給予的順序來進行,不會 A(); 執行完就去執行 C();,非同步的執行就是把原本要執行的內容往後放,這裡的現象稱為事件佇列(Event Queue)。

事件佇列 Event Queue

倘若下方有個函式,當中有一個非同步事件,非同步事件就會先移到事件佇列中,然後等到其他含是依序完成後,詳細解釋就是說當執行到 school(),時,setTimout()會先跳過不執行,等到 Go() 執行完後,才會執行 setTimeout 的事件佇列。

function toilet() {
  console.log('上廁所');
}

function Eat() {
  console.log('吃早餐');
}

function school(doSomething) {
  console.log('上學');
  setTimeout(function () {
    console.log('揹書包' + doSomething);
  }, 1000);
}

function Go() {
  toilet();
  Eat();
  school();
}
Go();

監聽事件的非同步

很常使用的就是點擊事件這個監聽,原生的 JS 會寫綁定 DOM 元素,並給予監聽,最後會給個 false 或 true,預設是給 false ,原因是要先點擊後才會執行事件。

CodePen https://codepen.io/hnzxewqw/pen/YzqzKrb


上一篇
JavaScript 從零開始 - Day7- function 的語法作用域 Lexical Scope
下一篇
JavaScript 從零開始 - Day9- 全域變數與區域變數
系列文
JavaScript 從零開始40
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言