TIL 22 | push() VS concat()



Push()vs Concat()


push()

arr.push([element1[, ...[, elementN]]])pushは、既存の配列に値を追加することで、元の配列を置き換えます.
const arr = [3, 6];
arr.push(9);
console.log(arr); // [3, 6, 9]
上記のコードに示すように、arrアレイ上でpush(9)を行い、arrをチェックすると、arrのソース自体が変更されたと判断できます.

concat()

array.concat([value1[, value2[, ...[, valueN]]]])concatは既存の配列を変更するのではなく、既存の配列に基づいて変更された新しい配列を返します.
const arr =[3, 6];
let result = arr.concat(9);
console.log(arr); // [3, 6]
console.log(result); // [3, 6, 9]
上記のコードから、result変数をconcat(9)してarrをチェックすると、既存の配列値に変化がないと判断でき、resultをチェックすると、元の配列arrに9が追加されたと判断できることがわかります.

差異


性能的にはpush()関数はconcat()関数より速い.したがって、push()関数を同じ目的で使用する場合、たとえば、アレイの後ろに要素を追加して新しいアレイを作成する場合(ただし、元のアレイが変換する必要がない場合)、push()関数を使用するとより良い場合があります.

BUT反応で使用する場合


reactでstateに新しい値を追加すると、push()メソッドとconcat()メソッドのメソッドを検索してまとめました.
結論として、stateに値を追加する場合、pushなどの元のデータを変更する方法に比べて、元の配列に新しいデータを追加して新しい配列を返す方法(concatなど)は、その後のパフォーマンスの改善においてよりよく、コードを変更する際にも便利である.