あーりーです。
JavaScriptについて書いています。
JavaScriptの記事は、この記事も含めて「初心者のための超わかりやすいJavaScript入門」にまとめてあります。よろしければご覧ください。
今回のテーマは「配列の要素の数を知る方法」です。
それがわかれば、その数に応じていろんな処理ができたりします。
本題に入る前に、まず…
配列と何か？
要素とは何か？
をおさえておきますね。
配列とは
配列とは、箱の集まりです。
その箱には、いろいろな情報を入れておくことができます。
箱に入れた情報は、あとから自由に取り出して使えます。
※配列について詳しくは、過去記事の「よくわかる配列の基本」をご覧ください。
要素とは
要素とは、配列の「箱」のことです。
さきほど、配列とは情報をしまっておける箱の集まりだと書きました。
この箱のことを「要素」といいます。
要素の数とは
要素の数とは、配列の中にある「箱の数」のことです。
要素の数を知る
今回のテーマは「配列の要素の数を知る方法」です。
つまり「箱の数を知る方法」です。
見ればわかるのでは？
配列の要素の数（箱の数）って、特別なことをしなくたって、ぶっちゃけスクリプトを目で見ればわかります。
でも、今回はそういう話ではなくて、より正確にいうと…
「プログラム上で要素の数を取得する方法」ということです。
length（レングス）
配列の要素の数を知る（取得する）には、length（レングス）を使います。
こういう形式で記述します。
配列の名前.length
たとえば…
「abc」という配列があって、その要素の数（箱の数）を取得するときは、こうです。
abc.length
実際に使ってみよう
lengthを組み込んだサンプルを実際に見てみましょう。
lengthで取得した要素の数（箱の数）を、画面に表示してみたいと思います。
こちらです。
<html> <head> </head> <body> <script> var abc=[100,200,300]; document.write(abc.length); </script> </body> </html>
緑色の部分がJavaScriptです。
実行結果
上の内容をメモ帳などのエディタにコピペしてHTML形式で保存し、そのファイルを開くと…
ブラウザに「3」と表示されます。
「3」とは、配列の要素の数（箱の数）です。
解説
では、どんな仕組みで要素の数（箱の数）が表示されるのか見てみますね。
まず、この行をご覧ください。
配列です。
var abc=[100,200,300];
配列の名前は「abc」です。
要素の数（箱の数）は3つですね。
そして、次の行です。
この赤い部分で、要素の数（箱の数）が取得されています。
document.write(abc.length);
取得された要素の数（箱の数）は、おなじ行のこの赤い部分によって、ブラウザに表示されます。
document.write(abc.length);
※ブラウザに文字を表示する方法について詳しくは「JavaScriptで文字を表示する方法」をご覧ください。
ブラウザの表示結果はこちらです。
3
ちゃんと要素の数（箱の数）が表示されていますね。
以上が、「配列の要素の数を知る方法」です。
例外
じつは…
lengthを使っても、正確な要素の数（箱の数）がわからないケースがあります。
箱の番号が飛んでいる場合はダメ
配列の箱には、番号が割り振られています。
番号は0番目から始まります。
0番目の箱、1番目の箱、2番目の箱…
といった具合です。
その番号が途中で飛んでいる（抜けている）と、正確な要素の数（箱の数）が取得できません。
lengthで要素の数が取得できない例
たとえば、こうです。
<html> <head> </head> <body> <script> var abc=[100,200,300]; abc[12]=400; document.write(abc.length); </script> </body> </html>
この部分をご覧ください。
var abc=[100,200,300];
「abc」という配列です。
0番目の箱に「100」が収納されています。
1番目の箱に「200」が収納されています。
2番目の箱に「300」が収納されています。
ここまではいつも通り。
とくに異常なしです。
つぎの行をご覧ください。
abc[12]=400;
この行では、あとづけで12番目の箱に「400」が収納されています。
※配列では、こんなふうに箱を追加できます。
つまり…
3番目から11番目までの箱がすっぽり抜けていて存在しません。
いきなり12番目の箱が登場しています。
箱の数は4つだけど…
上の例の場合、要素の数（箱の数）は…
0番目、1番目、2番目、そして12番目の、計4つです。
13と表示される
ところが。
lengthで要素の数を取得してみると、画面には「13」と表示されます。
要素の数は「4」なのに、「13」と表示されるんです。
要素の数が正確に取得できていませんよね。
なぜ？
最大の箱の番号＋1
どうしてこんなことが起こるのかというと…
じつはlengthの本当の意味は、
箱の数を取得する！
ではなく
「最大の箱の番号＋1」を取得する！
なんです。
上の例の場合、最大の箱の番号は「12」です。
だから、画面には「13」と表示されます。
箱の番号が順番に並んでいれば問題ないんですけど、上の例のように途中が抜けている場合は注意が必要ですね。
今回はこれでおしまいです。
お付き合いありがとうございました。
JavaScriptの記事は、この記事も含めて「初心者のための超わかりやすいJavaScript入門」にまとめてあります。よろしければご覧ください。
