JavaScript | 関数リテラル（無名関数）

主な内容の要点

JavaScriptでは「関数リテラル」を使って、名前のない関数（無名関数）を変数に代入して利用できます。これにより、一度しか使わない処理や、関数を引数として渡す場面で便利です。

ポイント解説

• 関数リテラルの基本形

let 変数名 = function(引数1, 引数2, ...){
  // 実行する処理
  return 戻り値;
};

let 変数名 = function(引数1, 引数2, ...){
  // 実行する処理
  return 戻り値;
};

function のあとに名前は不要（無名関数）。
代入した変数名を使って呼び出す。

• 呼び出し方

let dispHello = function(){
  console.log("Hello");
};

dispHello(); // → Hello

let dispHello = function(){
  console.log("Hello");
};

dispHello(); // → Hello

• 引数あり・戻り値ありの例

let add = function(x, y){
  return x + y;
};

let result = add(3, 4);
console.log(result); // → 7

let add = function(x, y){
  return x + y;
};

let result = add(3, 4);
console.log(result); // → 7

• 無名関数を引数に渡す 関数をそのまま別の関数に渡せる。

function dispNum(x, y, func){
  console.log(func(x, y));
}

dispNum(10, 8, function(a, b){
  return (a + b) / 2;
}); // → 9

function dispNum(x, y, func){
  console.log(func(x, y));
}

dispNum(10, 8, function(a, b){
  return (a + b) / 2;
}); // → 9

• 使いどころ
  • 一度しか使わない処理（イベント処理やコールバック関数など）
  • 関数を引数として渡すとき
  • 名前をつける必要がない場面

• 注意点
  • 関数リテラルは「代入後」にしか呼び出せない

hello(); // エラー
let hello = function(){ console.log("Hi"); };

hello(); // エラー
let hello = function(){ console.log("Hi"); };

→ 関数宣言（function hello(){}）と違い、巻き上げ（hoisting）が効かない。

まとめ

• 「関数リテラル」は 無名関数を変数に代入する書き方。
• 一度きりの処理や関数を引数に渡すときに便利。
• 宣言より後でしか呼び出せない点に注意。

こうした関数リテラルは、後に学ぶ「アロー関数」にもつながる重要な基礎です。

このあたりを理解すると、イベント処理や配列操作（map, filter など）で「関数を渡す」書き方がスムーズに理解できるようになります。