iT邦幫忙

2018 iT 邦幫忙鐵人賽
DAY 5
1
Modern Web

一個 JS 學習者的日常系列 第 5

一個 JS 學習者的日常 day 4

function example (msg, callback) {
  callback(msg)
}

example('hello callback', function(sayHi) {
   console.log(sayHi)
})

//結果:hello callback

我們時常可以在別人撰寫的 JS 程式碼當中看到,將一個函式傳入
另一個函式當中,然後稱之為 callback 函數。

思考:
什麼是 callback ? 專有名詞來說就是一種高階函式的用法,可以把函式當作變數傳遞,當然函數也可以返回函數。而這樣做讓我們可以在需要的時候再去使用它,或者解決非同步阻塞的問題。

這並非一個很陌生的用法,在我們之前處理陣列使用陣列方法的時候,就用了 callback 去處理我們的陣列資料。

var total = [1, 2, 3, 4, 5] 
total.reduce(function(init, next) {
  init += next
  return init
})
結果:15

在撰寫邏輯上,我們可以以直接的方式撰寫,或所謂 CPS (Continuation-passing style) 風格,在最前面的例子我們可以看到,我們同時將要使用的參數與調用的 callback 函式傳入同一個函式裡,在思考上需要想一下,但如果直接的寫法,變很能快速理解。尤其是當程式越來越複雜的時候。

function example (msg) {
  console.log(msg)
}

example('hello callback')

但真正使用的理由是,當小量的執行時,可以快速應付調用,但當我們事件與服務要求次數變多,要達到不阻塞I/O或多緒執行的效益時,便需要思考我們撰寫程式的邏輯與方式,並單純直覺的以單線作為考量。


上一篇
一個 JS 學習者的日常 day3
下一篇
一個 JS 學習者的日常 day5
系列文
一個 JS 學習者的日常30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言