初級のJavaScriptエラー 42問
14種類のエラーを、それぞれ複数パターンずつ収録しています。
- undefinedのプロパティ読み取りエラーの原因undefinedになった値のプロパティやメソッドにアクセスしようとしたときに出る、JavaScript学習者が最も多く遭遇するエラーです。値が本当にundefinedになる典型的な場面を整理します。
- ReferenceError: x is not defined の原因と直し方存在しない変数・関数名を参照したときに出るエラーです。タイプミスだけでなく、let/constのブロックスコープの外から参照した場合にも同じエラーになります。
- 括弧の閉じ忘れで出る SyntaxError の原因と直し方丸括弧・波括弧・角括弧の閉じ忘れで出る構文エラーです。Node.jsはファイルの終わりまで読んでから対応が崩れていることに気づくため、エラー行が原因の行と一致しないことがあります。
- 配列の範囲外アクセスがエラーにならずundefinedになるJavaScriptの配列は範囲外の添字にアクセスしてもエラーを投げません。静かにundefinedを返すため、Java・Python・C#のように例外で気づくことができません。
- == が意図しない型変換で真になってしまう(===との違い)==は比較の前に両辺の型をそろえようとするため、文字列の"0"や空文字列、falseなどが数値の0と等しいと判定されてしまいます。===は型変換をしないため、この種の事故を避けられます。
- TypeError: x is not a function の原因と直し方関数ではない値を関数として呼び出そうとしたときに出るエラーです。変数名やメソッド名のタイプミス、あるいはプロパティと勘違いした呼び出しで頻発します。
- カンマの付け忘れで出る SyntaxError の原因と直し方配列・オブジェクトの要素や関数の引数を並べる際、区切りのカンマを付け忘れたときに出る構文エラーです。改行で区切っているつもりでも、JavaScriptはカンマが無いと1つの要素の続きとして読もうとします。
- const宣言で初期値を書き忘れた原因と直し方constで変数を宣言する際に初期値を書き忘れたときに出るエラーです。letやvarと違い、constは宣言と同時に値を代入することが文法上必須です。
- 同じ変数名を2回宣言したエラーの原因と直し方同じスコープ内で同じ名前の変数をlet・constで2回宣言したときに出るエラーです。コピー&ペーストで既存の変数名とかぶってしまうケースが典型です。
- "合計: " + a + b が期待した数値の合計にならない理由文字列と数値を+で連続してつなげると、最初の+で文字列に変換されてしまい、それ以降の+はすべて文字列連結として扱われます。数値同士を先に計算したい場合は括弧で明示する必要があります。
- 関数がreturn文を書き忘れてundefinedを返してしまう計算結果を変数に入れても、return文で明示的に返さない限り、関数はundefinedを返します。JavaScriptは他言語と違い、最後に評価した式を自動で返すことはありません。
- push()の戻り値は追加後の配列ではなく新しい要素数Array.prototype.pushは追加後の配列ではなく、追加後の要素数(数値)を返します。戻り値を配列として扱おうとすると、数値にはない配列のプロパティやメソッドでエラーや予期しない結果になります。
- 文字列同士の + が連結になる理由数字だけの文字列同士でも、+演算子は数値としての加算ではなく文字列としての連結を行います。数値として計算したい場合はNumber()などで明示的に変換する必要があります。
- length はメソッドでなくプロパティという原因配列や文字列の要素数はlengthというプロパティで取得します。他言語のsize()やcount()のような感覚でlength()と関数呼び出しの形で書くとエラーになります。