JavaScript でオブジェクトの配列を効果的に複製するにはどうすればよいですか?

JavaScript でのオブジェクトの配列の複製

配列の構造

オブジェクトの配列の複製時、配列内のオブジェクトの構造とそのオブジェクトの構造を考慮することが重要です。関係。オブジェクトが配列内の他のオブジェクトを参照する場合、浅いコピーは新しいオブジェクトを作成するのではなく、参照を複製するだけです。

利用可能なソリューション

いくつかのアプローチがあります。特定の要件に応じて、JavaScript でオブジェクトの配列のクローンを作成します。

1. StructuredClone (ES2021)

StructuredClone メソッドは、複雑なオブジェクトのクローンを作成するための最も最新かつ効率的な方法です。元の配列内の構造と関係を保持したディープ コピーを作成します。

const clonedArray = structuredClone(originalArray);

2. JSON.parse

オブジェクトが JSON にシリアル化できる場合は、JSON.stringify を使用してオブジェクトを文字列に変換し、JSON.parse を使用してオブジェクトを解析してオブジェクトに戻すことができます。この方法は、シリアル化不可能なオブジェクトには機能しません。

const clonedArray = JSON.parse(JSON.stringify(originalArray));

3. Spread 演算子と Array.map

浅いオブジェクトのクローン作成には、Array.map 内で Spread 演算子 ... を使用できます。このアプローチではオブジェクトが再作成されますが、新しい参照は作成されません。これは効率的であり、浅いオブジェクトにのみ適用できます。

const clonedArray = originalArray.map(obj => ({ ...obj }));

4. jQuery のディープ コピー

jQuery の extend メソッドは浅いコピーに使用できますが、ディープ コピーには extend(true, {},originalArray) が必要です。ただし、この方法では再帰の問題が発生する可能性があります。

パフォーマンスに関する考慮事項

クローン作成メソッドのパフォーマンスは、オブジェクトの複雑さと構造によって異なります。一般に、structuralClone とスプレッド オペレーターの方が効率的です。提供された付録のサンプル配列のベンチマーク結果は、スプレッド演算子が JSON.stringify よりも大幅に高速であり、浅いオブジェクトのクローン作成に最適であることを示しています。

結論

クローン作成方法の選択は、アプリケーションの特定の要件によって異なります。複雑なオブジェクト構造のディープクローン作成には、structuraldClone をお勧めします。シリアル化可能なオブジェクトの浅いクローン作成には、JSON.stringify またはスプレッド演算子のアプローチを使用できます。

以上がJavaScript でオブジェクトの配列を効果的に複製するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。