JavaScriptで連想配列の要素数取得はlengthは×

2019年05月14日 (火)

JavaScriptで連想配列の要素数を取得しようとして
よくやってしまうことがあります。

それは、lengthプロパティを使って実行してしまい、
あぁっ 連想配列は、lengthプロパティで取得できないんだったといつも思います。

lengthではダメなんですよね。
Object.keys()を使用すれば、実現可能となります。

配列の要素数を取得する

まず確認の為、連想配列ではなく普通の配列の要素数を取得してみます。

配列要素数 取得

<script>
var Fruits = ["オレンジ", "アップル", "グレープ", "バナナ", "メロン"];
document.write("Fruitsの要素数は、" + Fruits.length + "です。");
</script>

結果

Fruitsの要素数は、5です。

連想配列の要素数を取得する

配列と同じようにして、連想配列の要素数を取得してみます。

連想配列 要素数 取得

<script>
var Fruits = {"orange":"オレンジ", "apple":"アップル", "grape":"グレープ", "banana":"バナナ", "melon":"メロン"};
document.write("Fruitsの要素数は、" + Fruits.length + "です。");
</script>

結果

Fruitsの要素数は、undefinedです。

まぁ、結果は分かったうえでこの記事を書いているので、
連想配列では、要素数を取得できず、undefined になりました。

なぜ、取得できないのか？
理由は、単純なようです。
連想配列には、.lengthのプロパティが存在しないだそうです。

lengthはメソッドではなくて、プロパティだということも理解していませんでした。
私はずっと、lengthはメソッドだと思っていました。

Object.keys()を使ってみる

それでは、お待ちかねです。
連想配列の要素数を取得する方法です。

Object.keys() で取得

<script>
var Fruits = {"orange":"オレンジ", "apple":"アップル", "grape":"グレープ", "banana":"バナナ", "melon":"メロン"};
document.write("Fruitsの要素数は、" + Object.keys(Fruits).length + "です。");
</script>

結果

Fruitsの要素数は、5です。

これで、JavaScriptで連想配列の要素数を取得することができました。

以上、連想配列の要素数を取得するJavaScriptのスクリプトでした。