ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript でオブジェクトの配列をディープ クローン作成する方法

JavaScript でオブジェクトの配列をディープ クローン作成する方法

Linda Hamilton
Linda Hamiltonオリジナル
2024-12-13 04:59:10123ブラウズ

How to Deep Clone an Array of Objects in JavaScript?

JavaScript でオブジェクトの配列のクローンを作成するには?

JavaScript で複雑なデータ構造を扱う場合、多くの場合、配列の代わりに配列のディープ コピーを作成すると便利です。浅いリファレンス。これにより、クローン コピーへの変更が元の配列に影響を与えず、その逆も同様になります。

ディープ コピーの作成

structurdClone の使用

最新のアレイのディープ クローン作成のアプローチは、structuraldClone を使用します。メソッド:

array2 = structuredClone(array1);

このメソッドは、ほとんどの最新ブラウザでサポートされており、信頼性の高いディープ クローン作成メカニズムを提供します。

JSON.parse を使用する

structurdClone が使用できない場合は、 JSON ベースの手法を使用できます:

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

このアプローチは、次のオブジェクトに対して機能します。 JSON シリアル化可能。つまり、JSON 文字列に変換したり、逆に変換したりすることができます。ただし、関数や特定のデータ型を含む複雑なオブジェクトには適していない可能性があります。

スプレッド演算子とマップの使用

浅いオブジェクトの場合、スプレッド演算子をマップと組み合わせて使用​​すると、パフォーマンスが向上します。

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

この手法では、配列内の要素ごとに新しいオブジェクトを作成し、クローンへの変更が影響を与えないようにします。

適切なアプローチの選択

オブジェクトの配列のクローンを作成するための最適なアプローチは、特定の要件によって異なります。信頼性の高いディープ コピーには、structuraldClone をお勧めします。 JSON シリアル化可能なオブジェクトの場合、JSON.parse および JSON.stringify は柔軟なオプションを提供します。浅いオブジェクトの場合、スプレッド演算子とマップ メソッドの方がパフォーマンスが向上します。

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

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