🐕

何が間違っている? JavaScript のトラブルシューティング②(その他のよくあるエラー)

2023/04/06に公開

MDN( https://developer.mozilla.org/ja/docs/Web/JavaScript
を参考に勉強するように注意が入ったので、こらを教本にしていきます。
その為、抜粋しながら進めたいと思います。

今回もこちらです。

その他のよくあるエラー

1. SyntaxError: missing ; before statement

日本語にすると『構文エラー:宣言の前に;がありません』
コード行のどこかの末尾にセミコロン(;)がないことを意味しています

2. Uncaught SyntaxError: Missing initializer in const declaration

const userGuess = Number(guessField.value);

checkGuess()関数内の59行目あたりにある、こちらのコードを下記のように変更します。

let userGuess === Number(guessField.value);

そうするとエラーがでました。


エラー内容

日本語にすると『キャッチされなかった構文エラー:const宣言に初期化子[1]がありません』

const宣言では値を指定する必要があります。
単純代入演算子(=)は値の代入を意味する演算子で、厳密等価演算子(===)は値と「データ型」まで含めた完全一致か不完全一致かを判定する演算子です。
そのため、今回はエラーが表示されました。

3.Uncaught TypeError: Assignment to constant variable.

if (userGuess === randomNumber) {

checkGuess()関数内の65行目あたりにある、こちらのコードを下記のように変更します。

if (userGuess = randomNumber) {

そうするとエラーがでました。


エラー内容

日本語にすると『捕まえられない種類のエラー: 定数変数への代入』

判定で常にtrueが返るようになり、常にプレイヤーが勝ったことになってしまいます。気を付けましょう!

とMDNに記載されているので、今回のエラーは違うものが表示されているようです。

今回のエラー内容の一部

  • ゲームを進めていくと前回の予想が表示されない
  • 予想があっている/間違えているの表示もされない
  • 入力された数字の大小もわからない
  • 途中であっている数字を入力しても勝ったことにならない
  • 11回以上入力してもエラーの回数が増えるだけで表示は変わらず

4.SyntaxError: missing ) after argument list

エラー内容

日本語にすると『構文エラー: 引数リスト[3]の後に)がありません』
関数やメソッドの呼び出しで、閉じ括弧())を忘れたことを表しています。

5.SyntaxError: missing : after property id

エラー内容

日本語にすると『構文エラー:プロパティ ID の後に:がありません』

たいてい、このエラーは JavaScript のオブジェクトの書き方が正しくないことに関連しているのですが、

function checkGuess() {

上記のコードを以下のように変えても起きるでしょう。

function checkGuess( {

この変更でブラウザーは関数の内容を関数の引数として渡しているように勘違いしてしまいます。括弧には気を付けましょう!

というわけで、上のコードにしてみるとこちらのエラーが表示されました。

日本語にすると『構文エラー: 予期しない識別子 'userGuess'』
それぞれ使用するものによってエラー表示が変わるんですかね。

6.SyntaxError: missing } after function body

エラー内容

日本語にすると『構文エラー: 関数本体の後に } がありません』
関数や条件ブロックの終わりの閉じ波括弧(})が抜けていることを表しています。

checkGuess() 関数の最後の閉じ波括弧を消すと発生します。

というわけで、上のコードにしてみるとこちらのエラーが表示されました。

エラー内容

日本語にすると『構文エラー: 入力の予期しない終了』
わかりにくいww

7.SyntaxError: expected expression, got 'string' または SyntaxError: unterminated string literal

エラー内容

日本語にすると
『①予期される式、取得した「文字列」』
『②終了していない直接記述される文字列』
文字列の始まりもしくは終わりの引用符(「」など記号)が抜けていることを表します。
①は文字列の始めの引用符の代わりに、ブラウザーが予期しない文字列を見つけたことを表します。
('string'には実際に見つけた文字列が入る)
②は文字列が引用符で終わっていないことを表します。

JavaScript エラーリファレンス

多数の種類のエラーをまとめてくれているページがあります。
JavaScript エラーリファレンス

HELP相談場所

わからないエラーコードに関して助けを求める場所を記載してくれています。
どうしてもわからないことがあれば、質問を記載して教えてもらえそうです。

文献表

脚注
  1. プログラミング言語において、変数を宣言するときに初期値を与えるための文法のこと。 ↩︎

  2. TypeErrorとは、異なるデータ型同士の演算や関数にて処理が行われた場合に発生するエラーです。 ↩︎

  3. 関数で処理を行うのに必要なデータを、関数を呼び出す側からもらうために引数を指定します。その引数が「仮引数」。仮引数は実際のデータがあるのではなく、あると仮定して処理を記述することができます。 ↩︎

Discussion