JavaScriptの「SyntaxError: missing ) after argument list」エラーの原因と解決方法

JavaScriptは、括弧によって関数呼び出しの開始位置と終了位置を認識します。関数が閉じられる前に構文の一部が欠けていると、「SyntaxError: missing ) after argument list」というエラーが発生します。

この記事では、このエラーの意味と発生理由を詳しく解説します。実際のコード例を通じて、問題の修正方法を一緒に学んでいきましょう。

SyntaxError: missing ) after argument list とは

「missing ) after argument list」というメッセージは、関数呼び出しの内部に構文エラーが存在することを示しています。

このエラーは、引数リストの末尾にカンマを追加したものの、その後に別の引数が続いていない場合によく発生します。

JavaScriptは、各カンマの後に別の引数が存在することを期待しています。別の引数が見つからない場合、コードを正しく解析できず、閉じ括弧の位置で構文エラーが発生します。

もう一つの原因として、関数内で引数を区切るために必要なカンマを、誤って文字列の中に含めてしまうケースが挙げられます。

このエラーに遭遇した場合は、エラーメッセージが指し示すコードの構文を慎重に見直しましょう。すべての括弧が正しく対応しているか、関数呼び出し内でカンマが正しく使用されているかを確認してください。

エラーが発生する具体例

ここでは、生徒が学校のテストに合格したかどうかを判定するプログラムを作成してみましょう。まず、生徒の成績と、合格・不合格をコンソールに出力するためのメッセージを定義します。

var grade = 57;
var message = "This student has X their test.";

変数「message」には、プレースホルダーとして文字「X」が含まれています。この「X」は、プログラムの後半で「passed（合格）」または「failed（不合格）」に置き換えます。

生徒の成績が53点を超えていればテストに合格、それ以外の場合は不合格とします。

成績が定義できたので、次にif文を使って合格か不合格かを判定します。

if (grade > 53) {
	message.replace("X," "passed");
} else {
	message.replace("X", "failed");
}

1つのif文と1つのelse文を使って、生徒が合格したか不合格かを判定しています。if文の条件がtrueと評価されれば、「message」文字列内の「X」は「passed」に置き換えられ、そうでなければ「failed」に置き換えられます。

メッセージの準備ができたので、JavaScriptコンソールにそのメッセージを出力しましょう。

console.log(message);

コードを実行して、何が起こるか確認してみます。

Uncaught SyntaxError: missing ) after argument list

コードは構文エラーを返しました。

解決方法

関数呼び出しの1つにミスがあるため、JavaScriptはコードを正しく評価できません。エラーの原因は引数リスト、つまり関数呼び出し内にあると特定できます。

該当する関数呼び出しを見てみましょう。

message.replace("X," "passed");
message.replace("X", "failed");

2つ目の文は構文的に正しく見えますが、1つ目の文にはエラーが含まれています。1つ目の文字列の後にカンマを置くべきところを、誤って文字列の中にカンマを入れてしまっています。最初のreplace()呼び出しの「X,」という部分に注目してください。

このため、引数リストに2つの値がカンマなしで連続して並ぶことになり、これは不正な構文です。引数は必ずカンマで区切る必要があります。

このエラーを修正するには、カンマを「X,」という文字列の中から外へ移動させます。

message.replace("X", "passed");

カンマを文字列の外に移動しました。コードを実行して、正しく動作するか確認してみましょう。

コードは次の結果を返します。

"This student has passed their test."

コードが正常に実行されました！

まとめ

「SyntaxError: missing ) after argument list」エラーは、関数呼び出しが正しく評価できない場合に発生します。このエラーを修正するには、引数が正しく記述されていることを確認しましょう。関数呼び出し内のすべての引数がカンマで正しく区切られているか、必ず再確認してください。

これで、この構文エラーをプロのように修正するための知識が身につきました！