2つの配列を組み合わせる方法は3つあります.


[プログラマー]ベストアルバム
問題を解く過程で,2組のコードを記述する部分に疑問が生じた.
    for (const genre of Object.keys(sortedTotalPlayDict)) {
        const selectedNumberList = sortedDict[genre].slice(0, 2).map((item) => item[NUMBER]);
      
        answer.push(...selectedNumberList);
    }
上記のコードで最終的に出力されるシナリオ(答え)と、選択した2つの収録曲の固有番号を含むシナリオ(selectedNumberList)を統合する方法を知りたいです.
まず、2つの配列を組み合わせる方法は3つあります.
1.push()関数と拡張オペレータの使用
2.concat()関数の使用
3. ...spread operator

1.push()とspreadオペレータの使用


push()関数のみを使用してカラム配列をマージします.
パラメータに渡される配列を要素として処理します.
したがって,配列の長さは+1である.
上記の問題では、たとえば
	answer.push(selectedNumberList)

配列の要素を答えに追加するのではなく、
配列自体が要素として追加されていることがわかります.
したがって
パラメータに渡されたアレイの各要素を新しいアレイにマージするには、
spread operator(...)を使用する必要があります.
	answer.push(...selectedNumberList)

拡張オペレータの使用
出力の結果値が表示されます.

2.concat()関数の使用

const concated = answer.concat(selectedNumberList);
concat()の関数は次のとおりです.
array.concat([value1[, value2[, ...[, valueN]]]])
パラメータを使用して、指定した配列または値を既存の配列に集計し、新しい配列を返します.
上記の問題を例にとると.
const concated = answer.concat(selectedNumberList);

3. ...拡張オペレータの使用


配列では、拡散演算子が配列内の要素を単一の要素に分解します.
したがって、2つの配列をそれぞれ1つの要素に分解して、新しい配列に含まれる次のコードを実装できます.
const spreaded = [...answer, ...selectedNumberList];

同様に,所望の結果が出力されていることが分かる.

なぜpush()ではなくconcat()とspreadオペレータを選択したのか


push()関数で要素を追加すると、元の配列の答え自体が変更されます.
ただしconcat()関数を使用すると、元の配列resultと新しい配列が生成されます.
したがって、元の配列を保持しながら新しい要素を含む配列を作成する場合はconcat()関数を使用することが望ましい.
pushを使用すると、所望の結果を出力することなく副作用が発生します.

Reference


https://hianna.tistory.com/397
https://m.blog.naver.com/PostView.naver?isHttpsRedirect=true&blogId=wideeyed&logNo=221797834089