lengthプロパティ

広告

lengthプロパティは配列の要素数を取得するのに使用します。 

a.length

配列の最後のインデックス+1を返します。

lengthプロパティを参照することで配列の要素数を取得できます。具体的には対象の配列の最後のインデックス+1の値が返されます。(インデックスは0から始まりますので+1された値となります)。

次の例を見てください。 

var ary = new Array("Tokyo", "Osaka", "Nagoya");
var len = ary.length;

上記の場合、lengthプロパティは「3」を返します。

配列に要素を追加するとlengthプロパティは自動的に変更されます。次の例を見て下さい。 

var ary = new Array("Tokyo", "Osaka", "Nagoya");
var len = ary.length;

ary[5] = "Fukuoka";
len = ary.length;

上記ではインデックスが5の要素に値を代入しています。その為、配列のlengthプロパティは自動的に「6」に変更されます。

lengthプロパティの値を変更

lengthプロパティは対象の配列の要素数によって自動的に変更されますが、この値は参照するだけではなく変更する事も可能です。次の例を見てください。 

var ary = new Array("Tokyo", "Osaka", "Nagoya");
ary.length = 2;

Arrayクラスのコンストラクタ関数で作成した配列は要素数が「3」ですが、その次の文にてlengthプロパティの値を「2」に設定しています。この結果、対象の配列の要素数は「2」に変更されるためインデックスが2の要素は無くなります。

今度はlengthプロパティの値を増加させてみます。次の例を見てください。 

var ary = new Array("Tokyo", "Osaka", "Nagoya");
ary.length = 5;

元々の配列は要素数が「3」ですが次の文にてlengthプロパティの値を「5」に設定しています。この結果、対象の配列の要素数は「5」に変更されます。追加された2つの要素には値が格納されていませんので要素の値は未定義値(undefined)が格納されているものとして扱われます。

lengthプロパティの利用方法

lengthプロパティの値を参照すると配列の要素の数が取得できますので、for文で配列の全ての要素を処理したい場合に利用することができます。 

var ary = new Array("Tokyo", "Osaka", "Nagoya");

for (var i = 0 ; i < ary.length ; i++){
  alert(ary[i]);
}

上記の場合、for文の条件式に「配列.length」を使用しています。

サンプルコード

では簡単なサンプルで試してみます。 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>JavaScript テスト</title>
</head>
<body>

<script type="text/javascript" src="./js/script2_1.js">
</script>

</body>
</html>

function print(str){
  document.write(str + "<br />");
}

var ary = new Array("東京", "大阪", "名古屋");

document.write("<p>");

for (var i = 0 ; i < ary.length ; i++){
  print("array[" + i + "] = " + ary[i]);
}

document.write("</p>");

document.write("<p>");

print("ary.length = 2");
ary.length = 2;

for (var i = 0 ; i < ary.length ; i++){
  print("array[" + i + "] = " + ary[i]);
}

document.write("</p>");

document.write("<p>");

print("ary.length = 4");
ary.length = 4;

for (var i = 0 ; i < ary.length ; i++){
  print("array[" + i + "] = " + ary[i]);
}

document.write("</p>");

上記を実際にブラウザ見てみると次のように表示されます。

p2-1

( Written by Tatsuo Ikura )