什麼是callback?

callback就是將function當作參數傳入另外一個函式裡

JavaScript的同步與非同步

• 同步：就像接力賽跑，當棒子沒有交給我，我就得等你，不能跑。
• 非同步：就像一般我們在點餐時，服務生會給號碼牌，我就可以離開櫃台先去逛街，櫃台也可以繼續為下一個客人點餐，接著只要等號碼牌響起，我再去取餐即可。

寫程式囉！

function mainFunction(callback){ //這個callback是一個變數名稱，一開始他還不知道他是誰
    var someData = 'Hello';
    callback(someData); //這裡定義了此函式：此函式的callback這個function被執行，且到時候會將someData傳入參數
}

mainFunction(function(a){ //這時候上面的callback知道他是誰了，callback (是) 這行函數。傳入的時候a = someData
    console.log(a)); //印出Hello
})
mainFunction(function(b){ //同上執行步驟
    console.log(b);
})

執行結果

Hello
Hello

補充教材1

• 變數可以存入函式(在JasCript的世界中變數或function都是物件)

function oldFunction(){
    console.log('old');
}

let newFunction = oldFunction;
// 確實有oldFunciotn的函式等著被觸發，但是只要沒有在後面加上()，就不會有觸發行為。所以這裡只是指定變數名稱但沒有執行的行為
// 試想，若newFunction = 3
// 那麼底下的觸發就會變成3()，這樣結果會找不到叫做function 3的可以執行而錯誤

newFunction();

補充教材2

• 同上一題，但是反過來

function mainFunction(callback){ //第一步：一開始callback不知道他是誰
    callback(); //最後：知道這裡要執行cool()
}

function cool(){
    console.log('coooool'); //這裡定義了cool()要做的事情
}

mainFunction(cool); // 然後第二步：cllback (是) cool

補充教材3

• var是全域宣告
• let有scope，只會取同一層最近的let值

let a = 123;
console.log(a);
//結果：123

但是

{let a = 123}
console.log(a);
//undefine
//{}大括號是表示區塊

補充教材4

• 一個完整個函式包含：input, 儲存, outpput

let add = function(a,b) {
    return a + b; //return是output = 5
}

let calc = function(num1, num2, callback) {
    return callback(num1, num2); //知道了去執行add(2,3)
}//如同下：

let calc = function(num1, num2, callback) {
    let result = callback(num1, num2);
    return result;
}

console.log(calc(2,3,add)); //知道callback (是)add