定義と使用方
配列のconcat()関数は、1つ以上の配列または値を渡された順に結合（concatenate、鎖のようにつなぐ）して、新しい配列を作成します。
この関数は、複数の配列を1つにまとめたり、配列と値を一緒に連結するときに便利です。
特徴
- 複数の配列を任意の順番でつなげて結合することができます。
- 配列に1つ以上の値を順番に追加することができます。
- 元の配列は変更されず、結合結果を含む新しい配列が返されます。
- 各配列の要素は渡された順番に連結され、結合された新しい配列が作成されます。
基本例
const array1 = [1, 2, 3];
const array2 = [4, 5, 6];
// 2つの配列を結合（連結）する
const twoConcatarray = array1.concat(array2);
console.log(twoConcatarray); // 出力: [1, 2, 3, 4, 5, 6]
// 3つの配列を結合（連結）する
const array3 = [6, 7, 8];
const threeConcatarray = array1.concat(array2, array3);
console.log(threeConcatarray); // 出力: [1, 2, 3, 4, 5, 6, 6, 7, 8]
// 配列と1つ以上の値を結合（連結）する
const arrayWithValues = array1.concat(9, 10, 11);
console.log(arrayWithValues); // 出力: [1, 2, 3, 9, 10, 11]
構文
arr.concat(value1[, ...[, valueN]])
戻り値
引数として指定された配列を順番に1つずつ連結し、新しい1つのArrayオブジェクトとして返します。
例
# 2つの配列を連結する
// 2つの配列を作成します。
const arr1 = [1, 2, 3];
const arr2 = [3, 4, 5];
// concat()関数を使って2つの配列を結合します。
const concatenatedArray = arr1.concat(arr2);
console.log(concatenatedArray); // 出力: [1, 2, 3, 3, 4, 5]
# 3つの配列を連結する
// 3つの配列を作成します。
const arr1 = [1, 2, 3];
const arr2 = [3, 4, 5];
const arr3 = [7, 8, 9];
// concat()関数を使って3つの配列を結合します。
const concatenatedArray = arr1.concat(arr2, arr3);
console.log(concatenatedArray); // 出力: [1, 2, 3, 3, 4, 5, 7, 8, 9]
# 値を配列に連結する
// concat()関数を適用する配列を作成します。
const arr1 = ["a", "b", "c"];
// concat()関数を使って配列に値を結合します。
const concatenatedArray = arr1.concat(1);
console.log(concatenatedArray); // 出力: ['a', 'b', 'c', 1]
2つの配列を連結して重複要素を削除する
# Set()オブジェクトを使用する
Set()オブジェクトは、重複しない要素のみを保存できるコレクションです。concat()関数で結合した配列をSet()オブジェクトに格納し、その後スプレッド（...）構文を使って再び配列に変換します。
// 2つの配列を作成します。
const arr1 = [1, 2, 3];
const arr2 = [3, 4, 5];
// concat()関数を使って2つの配列を結合します。
const concatenatedArray = arr1.concat(arr2);
// 重複した要素を削除するためにSetを使用します。
// スプレッド（...）構文を使って配列に変換します。
const uniqueArray = [...new Set(concatenatedArray)];
console.log(uniqueArray); // 出力: [1, 2, 3, 4, 5]
# filter()関数を使用する
filter()関数を使用して、concat()関数で結合した配列の要素を1つずつ確認し、重複する要素を削除します。
// 2つの配列を作成します。
const arr1 = [1, 2, 3];
const arr2 = [3, 4, 5];
// concat()関数を使って2つの配列を結合します。
const concatenatedArray = arr1.concat(arr2);
// filter()関数を使って重複した要素を削除します。
const uniqueArray = concatenatedArray.filter((item, index) => {
return concatenatedArray.indexOf(item) === index;
});
console.log(uniqueArray); // 出力: [1, 2, 3, 4, 5]
参考資料