length はメソッドでなくプロパティという原因
配列や文字列の要素数はlengthというプロパティで取得します。他言語のsize()やcount()のような感覚でlength()と関数呼び出しの形で書くとエラーになります。
エラーメッセージの読み方
main.js:2
main.js- ファイル名
2- 行番号 — 実際にクラッシュした行
TypeError- 例外クラス — 何が起きたか。ここを検索するのが最短です
nums.length is not a function- 内容 — 期待していたもの、または受け付けられなかったもの
このエラーが出る典型パターン
パターン1
1 const nums = [1, 2, 3]; 2 console.log(nums.length() ); ^
main.js:2
console.log(nums.length());
^
TypeError: nums.length is not a function
lengthは括弧を付けずに参照するプロパティです。関数のように呼び出すとエラーになります。
直し方: () を (空) にします。
広告
広告スロット(未設定)
パターン2
1 const letters = ["a", "b", "c", "d"]; 2 console.log(letters.length() ); ^
main.js:2
console.log(letters.length());
^
TypeError: letters.length is not a function
配列でも文字列でも、要素数の取得は括弧なしのlengthプロパティです。
直し方: () を (空) にします。
パターン3
1 const queue = ["x", "y"]; 2 console.log(queue.length() ); ^
main.js:2
console.log(queue.length());
^
TypeError: queue.length is not a function
他言語のsize()やcount()の感覚でlength()と書くとエラーになります。
直し方: () を (空) にします。
パターン4
1 const colors = ["red", "blue"]; 2 console.log(colors.length() ); ^
main.js:2
console.log(colors.length());
^
TypeError: colors.length is not a function
lengthはプロパティであってメソッドではありません。括弧を付けて呼び出すとエラーになります。
直し方: () を (空) にします。
パターン5
1 const stack = [1, 2, 3, 4, 5]; 2 console.log(stack.length() ); ^
main.js:2
console.log(stack.length());
^
TypeError: stack.length is not a function
要素数がいくつであっても、lengthに括弧は付けません。
直し方: () を (空) にします。
よくある誤解
他言語の経験から「要素数の取得はメソッド呼び出しのはず」と思い込むと、JavaScriptのlengthは括弧を付けないプロパティだという点でつまずきます。
実務での勘所
lengthが括弧の要らないプロパティなのは、単なる読み取り専用の値ではなく、代入もできる特殊な仕組み(アクセサプロパティ)として実装されているためです。実際にarr.length = 2のように代入すると、配列は2個の要素だけを残して切り詰められます。逆にarr.length = 5のように今より大きい数値を代入すると、足りない分は「空の枠」として広がります。関数呼び出しの括弧を付けるかどうかという見た目の違いだけでなく、代入によって配列そのものを操作できるという点でも、他言語のsize()やcount()とは性質が異なります。