##コールバック関数とは
関数の引数に渡された関数のことをコールバック関数といいます。
呼び出された関数が逆に関数を呼び出す側になるのでコールバックと言います。
実際にコードをみてみましょう。
// ②confirmed関数が呼び出される
function confirmed(fn) {
if(window.confirm("OKを押して下さい")) {
// ③引数で受け取った関数を呼び出す
fn()
}
};
// ①confiremed関数を呼び出す
confirmed(function () {
console.log("OKを押しました");
});
このコードを実行してみます。
ポップアップでOKを押してくださいと出てきます。
OKを押し、コンソールを確認するとOKを押しましたと表示されています。
処理を追ってみます。
まず最初にconfirmed関数を呼び出します。
この時、confirmed関数に対し引数で関数を受け渡しています。
JavaScriptでは関数もオブジェクトの一つであるため、関数を引数として指定することも可能です。
呼び出されたconfirmed関数は処理を実行します。
処理を実行するのでブラウザ上にポップアップでOKを押してくださいが表示されます。
ユーザーがOKを押下すると、呼び出された側であったはずのconfirmed関数が引数で受け取った関数を呼び出しています。
その結果console.log("OKを押しました")の処理が実行されるので、コンソールにOKを押しましたと表示されます。
最初は呼び出された側であったconfirmed関数が処理を実行した後、逆に関数を呼び出す側になったと思います。
これがコールバック関数です。
##コールバック関数が主に使われるケース
非同期処理を行う時に使用する事が多いです。
非同期処理というのは、誰かに仕事を任せる事で自分は別の仕事を進める事ができます。（つまり同時に複数処理を行える。）
この場合コールバック関数は、非同期処理でお願いした仕事が終わった後に、特定の処理を指定する時に使われます。
実際にsetTimeout関数を使用した例をみてみましょう。
setTimeout( コールバック関数 , 時間の指定 )
第一引数にコールバック関数、第二引数に時間の指定をする事ができます。
setTimeoutは時間を指定し、一定時間後に一度だけコールバック関数を実行する事ができます。
const Bye = function(){
console.log('さよなら！');
}
console.log('おはよう！')
setTimeout(Bye, 3000);
console.log('調子はどう?');
>> おはよう!
>> 調子はどう?
// 3秒後にByeが実行される
>> さよなら!
##まとめ
コールバック関数は関数の引数に渡された関数のことを指します。
非同期処理で使用する場合、お願いした仕事（非同期処理）が終わった後に、別の処理を指定する際にコールバック関数が使われます。