5.4 その他の便利な配列操作

実務でよく使われるその他の配列操作を紹介します。

5.4.1 スプレッド構文(…)

スプレッド構文を使うと、配列を展開したり、配列をコピーしたりできます。ここでは配列に対する使い方を確認します。オブジェクトに対するスプレッド構文は、6 章で学習します。

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];

// 配列の結合
const combined = [...arr1, ...arr2]; // [1, 2, 3, 4, 5, 6]

// 配列のコピー(シャローコピー)
const copy = [...arr1]; // [1, 2, 3]

5.4.2 分割代入

配列の要素を個別の変数に一度に代入できます。ここでは配列に対する使い方を確認します。オブジェクトに対する分割代入は、6 章で学習します。

const colors = ["赤", "青", "緑"];

// 従来の方法
const first = colors[0];
const second = colors[1];
const third = colors[2];

// 分割代入
const [first, second, third] = colors;
console.log(first); // "赤"
console.log(second); // "青"
console.log(third); // "緑"

5.4.3 slice と splice

slice:配列の一部を取り出す(元の配列は変更しない)

const fruits = ["りんご", "バナナ", "みかん", "ぶどう"];
const some = fruits.slice(1, 3); // ["バナナ", "みかん"](インデックス 1 から 3 の手前まで)

splice:配列の要素を削除・追加・置換する(元の配列を変更する)

const fruits = ["りんご", "バナナ", "みかん"];
fruits.splice(1, 1, "いちご"); // インデックス 1 から 1 個削除し、"いちご"を追加
// 結果: ["りんご", "いちご", "みかん"]