回調是個什麼鬼？

1.什麼是回調？

首先必定要搞清楚回調的英文名 —— callback
什麼是callback？回電話

假如你如今去一個商店買橘子，結果沒有橘子了
店員說，如今供貨不穩定，不知道啥時候纔能有橘子

let 商店
function 進貨橘子() {
    setTimeout(() => {
        商店.orange = 10
    }, Math.random() * 10000)
}
進貨橘子()

而後，你和店員說，這樣吧，留個電話號碼給你，橘子一到貨，你就回個電話給我
function 你的電話號碼() {
    console.log(arguments[0])
    console.log('好的，我立刻來')
}

店員說，行呀，那我把您的電話號碼登記好
function 進貨橘子(顧客電話號碼) {
    setTimeout(() => {
        商店.orange = 10
        顧客電話號碼().call(undefined,'橘子到啦，您快來買把')
    }, Math.random() * 10000)
}

咱們整理一下

let 商店
function 進貨橘子(顧客電話號碼) {
    setTimeout(() => {
        商店.orange = 10
        顧客電話號碼().call(undefined,'橘子到啦，您快來買把')
    }, Math.random() * 10000)
}

function 你的電話號碼() {
    console.log(arguments[0])
    console.log('好的，我立刻來')
}

進貨橘子(你的電話號碼)

1. 你留的電話號碼就是回調函數
2. 這個函數存在的意義就是可以有人通知你
3. 通知你的行爲就是觸發回調函數

2.常見的回調形式

2.1 Node.js 的 error-first 形式

先判斷error是否存在，存在則說明出現了錯誤，不存在則成功

fs.readFile('./1.txt', (error, content) => {
    if (error) {
        // 失敗
    } else {
        // 成功
    }
})

2.2 jQuery 的 success / error 形式

$.ajax({
    url: '/xxx',
    success: () => {
    },
    error: () => {
    }
})

2.3 jQuery 的 done / fail / always 形式

$.ajax({
    url: '/xxx',
}).done(() => {
}).fail(() => {
}).always(() => {
})

2.4 Prosmise 的 then 形式

詳情請見淺析Promise
全部異步操做返回一個帶有屬性then的對象

$.ajax({
    url: '/xxx',
}).then(() => {
}, () => {
}).then(() => {
})