配列の中身を書き換える

01 / 06

取り出せるなら入れ直せる

fruits[1] で2つ目が取り出せた。同じ書き方の左側に置いて = でつなげば、そこに新しい値を入れられるよ。

配列[番号] = 新しい値; の形だね。変数の更新とまったく同じ考え方だよ。

const fruits = ["りんご", "みかん", "もも"];fruits[1] = "ぶどう";console.log(fruits);

実行結果

["りんご", "ぶどう", "もも"]

02 / 06

書き換えると前の値は残らない。その場所の中身が置き換わるだけだよ。

書き換えていない場所はそのまま。指定した番号だけが変わる。

const nums = [10, 20, 30];nums[0] = 99;console.log(nums[0]);console.log(nums[1]);

実行結果

99
20

03 / 06

ここは意外に思うかもしれない。const で作った配列でも、中身の書き換えはできる。

const が禁止しているのは「その名前に別のものを入れ直すこと」であって、「入れ物の中を触ること」ではないんだ。だから配列は const で作るのがふつうだよ。

const list = ["あ", "い"];list[0] = "ん";console.log(list);

実行結果

["ん", "い"]

04 / 06

変数のときと同じで、右側にいまの値を書ける。+= のような省略記法もそのまま使えるよ。

点数を足す、在庫を減らす、といった処理がこれで書けるようになる。

const scores = [80, 60];scores[0] = scores[0] + 10;scores[1] += 5;console.log(scores);

実行結果

[90, 65]

05 / 06

取り出すときは範囲外だと undefined だったけれど、代入は違う。まだ無い番号に値を入れると、配列そのものがその長さまで伸びるんだ。

間に飛ばした場所は undefined で埋まる。意図せずやってしまうと、配列の長さが思ったより長くなって混乱するので気をつけよう。

const nums = [1, 2, 3];nums[5] = 99;console.log(nums);console.log(nums.length);

実行結果

[1, 2, 3, undefined, undefined, 99]
6

06 / 06

配列を別の変数に代入すると、同じ配列を指す名前が2つできるだけで、中身がコピーされるわけではない。片方を書きかえると、もう片方から見ても変わって見えるよ。

これは配列やオブジェクトに共通する性質で、初めて見ると驚くところだよ。

const original = ["あ", "い"];const alias = original;alias[0] = "ん";console.log(original);

実行結果

["ん", "い"]