JSでオブジェクトとオブジェクトをコピーする方法は沢山あります。

今回はとても簡単な方法を紹介します。

解決法

Object.assign()を使用します。

const p1 = {key1: 'taro'};
const p2 = {key2: 'shisuke'};
const p3 = Object.assign({}, p1, p2);
console.log(p3);

// 出力 ... {key1: "taro", key2: "shisuke"}

解説

Object.assign()は複数のオブジェクトを1つに合体（＝マージ）させることが出来ます。

Object.assign(target, arg1, arg2, ...);

targetはコピー先を指定します。例えばtargetを{}にすれば新たなオブジェクトとしてマージ出来ます。

arg1やarg2はマージさせたいオブジェクトの格納された定数を指定します。

第2引数以降は続けて第3引数、第4引数、、とすることで続けてオブジェクトの要素としてマージさせることが可能になります。

注意点

Object.assignはShallow Copy（浅いコピー）なので注意しなければ参照元もマージした後の結果が反映されてしまいます。

特に階層が深い場合は参照元もマージされた内容になってしまったなんてことが起こりがちなので注意してください。

関連記事:

WebページでJavaScriptが動かない場合の解決法 TS2305: Module ‘”react-router-dom”‘ has no exported member ‘RouteComponentProps’.が表示された時の解決方法 PhotoshopでSVG書き出しが出来なかったときの解決法 ショートコードをエディターで表示させる方法