デバッグスキルを磨いてエラーを撃退:JavaScript「形式パラメータが見つかりません」


原因

このエラーには、主に以下の原因が考えられます。

  • スペルミス
    関数名やパラメータ名のスペルミス
  • 引数の順序が間違っている
    関数の定義された順序と異なる順序で引数が渡されている場合
  • 引数の型が間違っている
    関数が期待する型と異なる型の引数が渡されている場合
  • 引数の数が足りない
    関数に必要な引数が渡されていない場合

解決策

このエラーを解決するには、以下の手順に従ってください。

  1. エラーメッセージを確認する
    エラーメッセージには、どの関数でこのエラーが発生したのか、どのパラメータが問題なのかに関する情報が含まれています。
  2. 関数の定義を確認する
    関数がどのように定義されているのかを確認し、必要なパラメータとその型、順序を確認します。
  3. 引数を修正する
    関数の定義に一致するように、引数の数、型、順序を修正します。
  4. スペルミスをチェックする
    関数名やパラメータ名にスペルミスがないことを確認します。

以下のコードは、greet 関数に必要な引数が渡されていないため、「形式パラメータが見つかりません」エラーが発生する例です。

function greet(name) {
  console.log("Hello, " + name);
}

greet(); // エラーが発生します

このエラーを解決するには、以下の様に引数を追加する必要があります。

greet("Alice"); // エラーは発生しません
  • デバッガツールを使用して、エラーが発生している箇所を特定することができます。


例 1:必要な引数が不足している

function greet(name) {
  console.log("Hello, " + name);
}

greet(); // エラーが発生します: "形式パラメータが見つかりません"

修正

greet("Alice"); // エラーは発生しません

例 2:引数の型が間違っている

この例では、multiply 関数は数値を引数として受け取るように定義されていますが、文字列が渡されています。

function multiply(x, y) {
  return x * y;
}

const result = multiply("10", "5");
console.log(result); // エラーが発生します: "形式パラメータが見つかりません"

修正

const result = multiply(10, 5);
console.log(result); // 50を出力

例 3:引数の順序が間違っている

この例では、swap 関数は最初の引数として a 、2番目の引数として b を受け取るように定義されていますが、引数が逆の順序で渡されています。

function swap(a, b) {
  let temp = a;
  a = b;
  b = temp;
}

let x = 10;
let y = 20;

swap(y, x);
console.log(x, y); // 20 10 (期待: 10 20)

修正

swap(x, y);
console.log(x, y); // 10 20

この例では、printMessage 関数の名前が誤って printMassage と記述されています。

function printMessage(message) {
  console.log(message);
}

printMassage("Hello, world!"); // エラーが発生します: "printMassage は定義されていません"
function printMessage(message) {
  console.log(message);
}

printMessage("Hello, world!"); // エラーは発生しません


関数の引数リストを明確に記述する

関数を定義する際には、必要なすべての引数を明確に記述するようにしましょう。引数の型とデフォルト値も指定しておくと、コードがより読みやすくなり、エラーを防ぐことができます。

function greet(name = "World") {
  console.log("Hello, " + name);
}

greet(); // "Hello, World" を出力
greet("Alice"); // "Hello, Alice" を出力

デフォルト値を使用する

オプションのパラメータには、デフォルト値を設定することができます。これにより、関数を呼び出す際に引数を省略することができます。

function multiply(x, y = 1) {
  return x * y;
}

const result1 = multiply(10); // 10 を出力
const result2 = multiply(10, 5); // 50 を出力

オプションパラメータを使用する

引数がオプションである場合は、undefined を使用して明示的に示すことができます。

function greet(name, message = undefined) {
  if (message) {
    console.log(name + ", " + message);
  } else {
    console.log("Hello, " + name);
  }
}

greet("Alice"); // "Hello, Alice" を出力
greet("Bob", "Good morning!"); // "Bob, Good morning!" を出力

レストパラメータを使用する

可変個数の引数を処理する必要がある場合は、レストパラメータを使用することができます。レストパラメータは、配列として渡された引数を格納します。

function sum(...numbers) {
  let total = 0;
  for (const num of numbers) {
    total += num;
  }
  return total;
}

const result = sum(1, 2, 3, 4, 5);
console.log(result); // 15 を出力

分解代入を使用する

オブジェクトから引数を抽出する場合は、分解代入を使用することができます。

function greet({ name, message }) {
  console.log(name + ", " + message);
}

const person = { name: "Alice", message: "Hello!" };
greet(person); // "Alice, Hello!" を出力