定義と使用方

配列の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]

参考資料