ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript で相互接続されたオブジェクトの配列をディープ コピーする方法

JavaScript で相互接続されたオブジェクトの配列をディープ コピーする方法

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-12-11 19:51:14199ブラウズ

How to Best Deep Copy an Array of Interconnected Objects in JavaScript?

相互接続されたオブジェクトの配列のコピー

同じ配列内の他のオブジェクトへの参照を持つオブジェクトの配列など、複雑なデータ構造を操作する場合、真のディープ コピーを作成します挑戦的になる可能性があります。さまざまなアプローチを見てみましょう:

structuraldClone を使用したディープ コピーの作成

ディープ コピーの最新のソリューションは、structuraldClone() を使用します。

array2 = structuredClone(array1);

このメソッドは広範囲をサポートします。多くのデータ型をサポートしており、ほとんどのブラウザでサポートされています。

によるディープ コピーの作成JSON.parse

JSON シリアル化可能なコンテンツを含むオブジェクトの場合、簡単な 1 行の解決策は次のとおりです。

let clonedArray = JSON.parse(JSON.stringify(nodesArray))

ただし、他のものと比較すると、シリアル化不可能なコンテンツとパフォーマンスの問題に関する制限があります。

スプレッド演算子を使用したディープ コピーの作成

配列に浅いオブジェクトが含まれている場合、 .map() と組み合わせたスプレッド演算子は、高速かつ効率的なディープ コピーに使用できます。

clonedArray = nodesArray.map(a => ({...a}));

このメソッドは、JSON.parse よりも大幅に優れています。

考慮事項

  • パフォーマンス: ディープ コピーのパフォーマンスは、データのサイズと複雑さによって異なります。構造物。さまざまなアプローチのベンチマークを行うことをお勧めします。
  • 互換性: StructuredClone() には、比較的新しいブラウザ バージョンが必要です。互換性が懸念される場合は、代替方法を使用してください。
  • シリアル化とクローン作成: オブジェクトをネットワーク経由で送信する必要がある場合は、クローン作成ではなくシリアル化を検討することをお勧めします。

以上がJavaScript で相互接続されたオブジェクトの配列をディープ コピーする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。