Javascriptオブジェクトをクローンする [30seconds of interviews]

How do you clone an object in JavaScript?

スプレッド構文...を使うと、オブジェクト自身の列挙可能なプロパティを新しいオブジェクトにコピーできる。オブジェクトの浅いクローン(shallow clone)が作成される。

const obj = { a: 1, b: 2 }
const shallowClone = { ...obj }

上記のテクニックでは、prototypeは無視される。さらにネストされたオブジェクトはクローンされずそれらの参照がコピーされるので、ネストされたオブジェクトは依然としてオリジナルと同じオブジェクトを参照する。ディープクローンする場合は、オブジェクト内にネストされる可能性のある任意のタイプのオブジェクト(Date, RegExp, Function, Setなど)を効果的にクローンするために上記の方法よりはるかに複雑になる。

色々なコピー方法:

• JSON.parse(JSON.stringify(obj))
  • シンプルなオブジェクトのディープクローンに使えるが、CPUを大量に消費し、有効なJSON(関数を削除、循環参照を許可しない)のみしか受け付けない
• Object.assign({}, obj)
  • 浅いコピー。https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Object/assign#Deep_Clone
• Object.keys(obj).reduce((acc, key) => (acc[key] = obj[key], acc), {})

30secondsofinterviews.org