配列の長さを使う

01 / 05

数字を手で書くのは危ない

ここまでは i < 3 のように、要素の数を自分で書いてきた。

でもこれ、あとで要素を増やしたときに直し忘れる。書き忘れると最後の1件だけ処理されない、という気づきにくいバグになるよ。

02 / 05

配列の後ろに .length と書くと、いま入っている要素の数が取り出せる。

数えるのは自分ではなく配列の仕事、というわけだね。

const fruits = ["りんご", "みかん", "もも"];console.log(fruits.length);

実行結果

03 / 05

i < 3 の 3 を fruits.length に置き換えれば、要素が何個でも正しく回る繰り返しになる。

これが for と配列を組み合わせるときの完成形。これから何度も書く形だよ。

const fruits = ["りんご", "みかん", "もも", "なし"];for (let i = 0; i < fruits.length; i++) {  console.log(fruits[i]);}

実行結果

りんご
みかん
もも
なし

04 / 05

番号は 0 から始まるので、最後の番号は length より1つ小さい。

要素が3つなら length は 3、最後の番号は 2 だね。list[list.length - 1] と書けば、長さがいくつでも最後の要素が取り出せるよ。

const list = ["あ", "い", "う"];console.log(list.length);console.log(list[list.length - 1]);

実行結果

3
う

05 / 05

要素が2つの配列なら、番号は 0 と 1 だけ。まだ無い 2 番に値を入れると、要素が1つ増えて .length も 2 から 3 になるよ。

長さは自分で書き換えなくていい。中身に合わせて勝手に変わるんだ。

それじゃあ、自分でも足してみよう。

const colors = ["あか", "あお"];colors[2] = "きいろ";console.log(colors.length);console.log(colors);

実行結果

3
["あか", "あお", "きいろ"]