配列の長さを取得したいけど、どうやってやればいいのかわからない
というJavaScript初心者の方へ、
- ・lengthプロパティで配列の長さを取得する方法
- ・lengthプロパティで配列の要素を増減させる方法
- ・lengthプロパティの注意点
をご紹介します。
ぜひ参考にしてみてくださいね。
目次
lengthプロパティで配列の長さを取得する
JavaScriptで配列の長さを取得するにはlengthプロパティを使用するだけでOKです。
書き方は以下の通り。
var 配列名.length;
とてもシンプルでわかりやすいですね。
では実際のコードを見てみましょう。
|
1 2 |
var arr1 = ['ごりら', 'らくだ', 'ぱんだ']; console.log(arr1.length); |
表示結果
3
このように、配列の中身が数値で返ってきます。
配列の長さを取得したい時は、ぜひ使ってみてくださいね。
lengthプロパティで配列の要素を増減させる
lengthプロパティに数値を指定することで、要素の数を増減させることもできます。
配列の要素の数を増やす
まずは要素の数を増やしてみます。以下の例を見てみましょう。
|
1 2 3 4 |
var arr2 = ['まぐろ', 'はまち', 'たい']; arr2.length = 5; console.log(arr2); |
表示結果
(5)[‘まぐろ’, ‘はまち’, ‘たい’, empty × 2]
このように5を指定することで、もともと3つしかなかった配列の要素が5つに増えています。
配列の要素の数を減らす
次に要素の数を減らす場合です。
|
1 2 3 4 |
var arr2 = ['まぐろ', 'はまち', 'たい']; arr2.length = 2; console.log(arr2); |
表示結果
(2)[‘まぐろ’, ‘はまち’]
このように2を指定することで、もともとあったはずの’たい’が削除され、要素が2つに減っています。
lengthプロパティの注意点
lengthプロパティを使う場合に注意しなければならない点があります。
lengthプロパティを使うことで配列の要素の数が取得できましたが、必ずしも要素の数ではない場合があります。
以下の例を見てみましょう。
|
1 2 3 4 |
var arr3 = ['めろん', 'すいか', 'おれんじ']; arr3[5] = 'ばなな'; console.log(arr3.length); |
表示結果
6
要素の数は4つしかないはずなのに、表示結果は6です。
これはなぜかというと、lengthプロパティで取得できる数は配列のインデックス番号の最大値+1だからです。
なので、arr3[5]でインデックス番号4を飛ばして5に値を入れたため、インデックス番号の最大値+1である6が表示されたというわけなのです。
まとめ
いかがだったでしょうか？
JavaScriptで配列の長さを取得する方法について、
- ・lengthプロパティで配列の長さを取得する方法
- ・lengthプロパティで配列の要素を増減させる方法
- ・lengthプロパティの注意点
以上の3つの点からご紹介しました。
lengthプロパティを使えば、こんなに簡単に配列の長さが取得できるんです。配列の長さがうまく取得できなくて困った時には、ぜひ参考にしてみてくださいね。
