callback関数とは

callback is just a function that you pass as a parameter to another function that function will do some work and then call that callback function back

JavaScript Callbacks Explained in 5 Minutes (Essential for asynchronous code!)より

↓
コールバック関数は、
他の関数の引数として渡す関数で、
その関数の処理が終わった後にコールバック関数が呼ばれる。

使用例

setTimeoutは引数にコールバック関数を持つ。
js↓

setTimeout(()=>{
      console.log('1秒後に実行');
},1000);

//同じ意味
const cb = ()=>{
    console.log('1秒後に実行');
}
setTimeout(cb,1000);

↓結果をコンソールで確認（実行後、1秒後にコンソールに表示される）

コールバック関数が実行される仕組み

例

                    //→説明1
console.log('1');　 //→説明2 //→説明4

setTimeout(()=>{
    console.log('2'); //→説明3 //→説明5
},0);

console.log('3');   //→説明2 //→説明4

↓結果

//→1,3,2の順で表示される

仕組み

1.コードの実行開始
2.グローバルコンテキストがコールスタックに積まれる
3.タスクが登録される
　コールバック関数がタスクキューに登録される
4.コールスタックが空になるまで実行される
5.コールスタックが全て消滅した後に、タスクキュー内のタスクが実行される。
　（コールバック関数が実行される。）

非同期処理の後に実行したい処理がある場合は、
コールバック関数の中にコールバックを入れる必要がある。
（コールバック関数は、グローバル関数が全て実行された後に実行されるため）

→順に実行したい処理がたくさんあると、コールバック地獄となる可能性
→解決方法として、非同期処理を扱うためのオブジェクトPromiseが追加された。（ES6）

参考サイト

一番しくっりきた解説ビデオ↓