iT邦幫忙

2021 iThome 鐵人賽

DAY 27
0
自我挑戰組

轉職軟體工程師的543系列 第 27

【Day 27】JavaScript 回呼函式(callback function)

  • 分享至 

  • xImage
  •  

回呼函式,或簡稱回調、回呼(Callback 即call then back 被主函式呼叫運算後會返回主函式),是指通過參數將函式傳遞到另一個函式的函式。它會在外部函式內運行、以完成某些事情。

為何要使用CallBack?
要理解JavaScript是如何執行程式,首先要先理解同步( Synchronous , sync )與異步( Asynchronous , async )程式執行的差異。

同步執行,意思就是一次只能做一件事情,如果安排了很多事情要給他做,他就會讓這些事情去排隊,再一件一件做,逐行執行。 這就是所謂的同步,一次只做一件事情。 一旦主程式需要執行超長任務時,會有等待的時間或延遲的問題,這樣便會影響到後續程式的執行,造成阻塞的情況發生以及時間的浪費。

異步的概念則是剛好相反,同時可以做很多件事情,不需要等到前一件事情做完才做下一件事情。

setTimeout() 與 setInterval()

根據 MDN 定義 setTimeout() 的作用 是在延遲了某段時間 (單位為毫秒) 之後,才去執行「一次」
而 setInterval() 則是固定延遲了某段時間之後,才去執行對應的程式碼,然後「不斷循環」。

function first(){
  console.log('This is first funtion');
}

function second(fn){
  for(let i = 1; i <= 1 ; i++){
    console.log('This is second funtion');
  }
  if(typeof fn ==='function')
    fn();  
}

console.log('一般函式: ')
first()
second()

console.log('回呼函式,function first 被function second(f)以參數的方式傳入到second(fn)裡: ')
second(first);

//每隔幾毫秒做1次
setInterval( first , 2*1000 );

//幾毫秒之後做這件事
setTimeout( first , 2*1000 );

上一篇
【Day 26】JavaScript AJAX - XMLHttpRequest
下一篇
【Day 28】JavaScript Promise
系列文
轉職軟體工程師的54330
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言