JavaScript | 基礎構文:関数 – コールバック関数の基礎

JavaScript JavaScript
スポンサーリンク

コールバック関数とは何か

コールバック関数とは、「関数に渡して、あとで呼び出してもらう関数」のことです。通常は自分で関数を呼び出しますが、コールバック関数は「別の関数に渡して、その関数の中で呼び出される」仕組みになっています。これにより、処理の順番を柔軟に変えたり、あとで実行する処理を差し替えたりできます。


基本構文と流れ

コールバック関数は「関数を引数として渡す」ことで使います。

function main(callback) {
  console.log("メイン処理を開始");
  callback(); // 渡された関数を呼び出す
  console.log("メイン処理を終了");
}
JavaScript

ここで callback がコールバック関数です。呼び出し側が好きな関数を渡せます。


例題で理解する

例題1:単純なコールバック

function greet(callback) {
  console.log("こんにちは!");
  callback(); // 渡された関数を呼び出す
}

function afterGreeting() {
  console.log("挨拶が終わりました");
}

greet(afterGreeting);
JavaScript

結果は以下のようになります。

こんにちは!
挨拶が終わりました

greet の中で afterGreeting が呼び出されました。


例題2:配列の処理に使う

JavaScript の配列メソッド forEach はコールバック関数を使います。

const fruits = ["apple", "banana", "orange"];

fruits.forEach(function(fruit) {
  console.log(fruit);
});
JavaScript

結果は以下のようになります。

apple
banana
orange

ここで function(fruit) { ... } がコールバック関数です。forEach が要素ごとに呼び出してくれます。


例題3:非同期処理に使う

コールバック関数は「あとで処理する」場面でよく使われます。

function fetchData(callback) {
  setTimeout(() => {
    const data = "サーバーからのデータ";
    callback(data); // データを渡して呼び出す
  }, 1000);
}

fetchData(function(result) {
  console.log("取得結果:", result);
});
JavaScript

結果は1秒後に

取得結果: サーバーからのデータ

と表示されます。


コールバック関数のメリット

処理の順番を柔軟にできる

「終わったらこれを実行してね」と関数を渡せるので、順番を制御できます。

再利用性が高い

同じ関数に違うコールバックを渡せば、処理を簡単に差し替えられます。

非同期処理に便利

時間がかかる処理(サーバー通信やファイル読み込みなど)が終わったあとに実行する処理を指定できます。


まとめ

  • コールバック関数は「関数に渡して、あとで呼び出してもらう関数」。
  • 配列処理や非同期処理などでよく使われる。
  • 処理の順番を柔軟に制御でき、再利用性も高い。

初心者は「コールバック関数は“あとで呼んでもらうために渡す関数”」と覚えると理解しやすいです。

タイトルとURLをコピーしました