1 スプレッド構文
『...』で配列を展開することができます。
const arr = [1,2];
console.log(arr);
// 配列を展開
console.log(...arr);
スプレット構文で合計処理をする.
...は順番処理として覚えれば問題ありません。
// sumFun関数を作る
const sumFun = (num1, num2) => console.log(num1 + num2);
// sumFun(arr[0],arr[1]);
// スプレット構文で書く
sumFun(...arr);
配列をまとめることもできます。
const arr1 = [1,2,3,4,5];
const [num1, num2, ...arr2] = arr1;
console.log(num1);
console.log(num2);
console.log(...arr2);
スプレッド構文で配列をコピー、結合することもできます。
const arr4 = [10,20,30];
// ...でarr4をコピー
const arr5 = [...arr4];
console.log(arr5);
コピーだけならconst arr5 = arr4;で書くほうが楽と思う人がいると思いますが、
ここで気をつけないと、JSの参照型の罠にはまる可能性があります。
下記の例を確認ください。
参照渡しとはなどのキーワードで検索しても良いと思います。
const arr4 = [10,20,30];
const arr5 = arr4;
arr5[0] = 30;
console.log(arr4);
// arr5の値だけを変更するつもりですが、arr4も変更されました。
しかし、スプレッド構文でコピーすると元の値を影響しないです。配列をコピーしたい時は、スプレッド構文を利用してください。
スプレッド構文で配列を結合することもできます。
const arr4 = [10,20,30];
const arr6 = [40,50];
// ...でarr4とarr6を結合
const arr7 = [...arr4,...arr6];
console.log(arr7);
// 結果は10,20,30,40,50