JavaScript ～配列②～

spliceコード

splice()はある配列［80,60,90,20,40］の途中の要素を削除したい場合や、新たに［50,70］を入れたいときなどと言ったような場合に使われるコードです。

splice()コードは以下の考えで書いていきます。
splice(変化が開始する位置,削除数,追加する要素)
「変化が開始する位置」とは 要素のインデックスを言います。配列が［80,60,90,20,40］だった場合 (80は0),(60は1),(90は2)．．．と続いていきます。

例えばスコア80,60,90,20,40点の90点が間違いで消したい！と言った場合を見てみましょう。

const score = [80,60,90,20,40];
 score.splice(2,1);
 console.log(score);

書いてあげると90点が削除され、［80,60,20,40］となります。
これで途中の要素を削除出来たと思います。

次にスコアが80,60,90,20,40点だった場合、60点の前に50,70点を追加したい場合

const score = [80,60,90,20,40];
score.splice(1,0,50,70);
console.log(score);

と書いてあげると60点の前に50,70点が入っていると思います。

60点が間違いで50,70点を追加したい場合は
削除数を1としてあげればそのようになるかと思います。

スプレッド構文

スプレッド構文とはスコア①とスコア②があった場合、スコア①をスコア②に入れて表示したい場合を考えてみましょう。

不正解

const score1 = [10,20];
const score2 = [50,60,80,score1];
console.log(score2);

このように書くと［50,60,80,Array(2)］と表示されてしまいます。

［50,60,80,10,20］と表示するには以下のように書きます。

正解

const score1 = [10,20];
const score2 = [50,60,80,...score1];
console.log(score2);

どこが変わったか分かりますか？

答えは　score1に … が付け足されているです。
この … を付け足すとスプレッド構文となります。

分割代入

ある配列の数字を定数に入れたい場合は以下のように書きます。

const scores = [80,50,90,40];
  const [a,b,c,d] = scores;
  console.log(a);
  console.log(b);
  console.log(c);
  console.log(d);

と書いてあげると配列を定数に直して表示してくれます。

コンソール
80
50
90
40

と表示されるでしょう。

また、定数に入れたいのは最初の二つだけで後の二つは配列のままで良かった場合は

const scores = [80,50,90,40];
  const [a,b,...others] = scores;
  console.log(a);
  console.log(b);
  console.log(others);
  

コンソール
80
50
[90,40]

と表示されます。先ほどのスプレッド構文と形は同じですが、今使った構文はレスト構文と言います。
よく覚えておいて下さい。