1. 導入：なぜこのエラーが重要なのか
Web開発の現場で、ふとした瞬間に遭遇する「SyntaxError: missing formal parameter」。このエラーは、初心者が関数を定義する際に最も陥りやすい罠の一つです。特に「関数を呼び出す時（実行時）」と「関数を定義する時」の文法を混同してしまうことで発生します。このエラーの根本原因を正しく理解することは、クリーンでバグのないコードを書くための第一歩です。
2. 基礎知識：Formal Parameter（仮引数）とは
プログラミングにおいて「Formal Parameter（仮引数）」とは、関数定義の丸括弧の中に書く「入れ物（変数名）」のことです。
JavaScriptの関数定義におけるルールとして、括弧の中には必ず「識別子（Identifier）」を指定しなければならないという決まりがあります。識別子とは変数名のように、データの入れ物となる名前のことです。対して、数値を直接書いたり、文字列を囲んだりすることは「値」であり、これらを定義側に書いてしまうと、JavaScriptエンジンは「ここは変数名であるべき場所だ」と判断し、構文エラー（SyntaxError）を返します。
3. 実装/解決策：正しい定義と呼び出しの分離
このエラーを回避する鍵は、定義と呼び出しを明確に分けることです。
・関数定義時：任意の変数名（識別子）を置く。
・関数呼び出し時：実際の値（実引数）を渡す。
この原則を守るだけで、このエラーは完全に防ぐことができます。
4. サンプルプログラム：エラー例と正しい実装
以下のコードで、何が間違いでどう修正すべきかを確認してください。
// --- エラーが発生するコード ---
// 関数定義の括弧の中に、直接数値を書いてしまっている
function multiply(5) {
return 5 5;
}
// 実行結果：SyntaxError: missing formal parameter
// --- 正しい実装 ---
// 1. まず「変数名（仮引数）」を使って定義する
function multiply(number) {
return number number;
}
// 2. 呼び出す時に「具体的な値」を渡す
const result = multiply(5);
console.log(result); // 25と出力される
// オブジェクトの受け渡しも同様
function showMessage(data) {
// ここでdataは呼び出し時に渡されたオブジェクトそのものになる
console.log(data.text);
}
// 呼び出し側でオブジェクトを渡す
showMessage({ text: "こんにちは！" });
5. 応用・注意点：現場で陥りやすい罠
実務で特によくあるのが、ライブラリのドキュメントを参考にした際に、例示されている「呼び出しサンプル」と「定義の書き方」を混同してしまうケースです。
特に分割代入（Destructuring）を使用する際、以下のように書いてしまうミスが多発します。
誤：function user({ name: “Guest” }) { … }
正：function user({ name = “Guest” }) { … }
括弧の中でイコール（=）を使って値を指定するのは「デフォルト引数」として正しい文法ですが、コロン（:）を使って値を決め打ちするのは「値の代入」とみなされ、エラーとなります。引数の設定はあくまで「変数としての受け皿」であることを常に意識しましょう。コードレビューの際は、関数定義の引数リストに具体的なリテラル値（数値や文字列）が含まれていないかを確認する習慣をつけるのがおすすめです。
コメント