Heim > Web-Frontend > js-Tutorial > Wie kann man Arrays von Objekten in JavaScript effektiv klonen?

Wie kann man Arrays von Objekten in JavaScript effektiv klonen?

Susan Sarandon
Freigeben: 2024-12-18 15:21:10
Original
783 Leute haben es durchsucht

How to Effectively Clone Arrays of Objects in JavaScript?

Arrays von Objekten in JavaScript klonen

Struktur von Arrays

Beim Klonen von Arrays von Objekten ist es wichtig, die Struktur der Objekte innerhalb des Arrays und ihre Beziehungen zu berücksichtigen. Wenn die Objekte auf andere Objekte innerhalb des Arrays verweisen, repliziert eine flache Kopie nur die Referenzen, anstatt neue Objekte zu erstellen.

Verfügbare Lösungen

Es gibt mehrere Ansätze dafür Klonen von Arrays von Objekten in JavaScript, abhängig von den spezifischen Anforderungen:

1. StructuredClone (ES2021)

Die StructuredClone-Methode ist die modernste und effizienteste Möglichkeit, komplexe Objekte zu klonen. Es erstellt eine tiefe Kopie und behält die Struktur und Beziehungen innerhalb des ursprünglichen Arrays bei.

const clonedArray = structuredClone(originalArray);
Nach dem Login kopieren

2. JSON.parse

Wenn die Objekte in JSON serialisierbar sind, können Sie sie mit JSON.stringify in einen String konvertieren und sie dann mit JSON.parse wieder in Objekte analysieren. Dieser Ansatz funktioniert nicht für nicht serialisierbare Objekte.

const clonedArray = JSON.parse(JSON.stringify(originalArray));
Nach dem Login kopieren

3. Spread-Operator und Array.map

Für das flache Klonen von Objekten können Sie den Spread-Operator ... innerhalb von Array.map verwenden. Bei diesem Ansatz werden die Objekte neu erstellt, es werden jedoch keine neuen Referenzen erstellt. Es ist effizient und nur auf flache Objekte anwendbar.

const clonedArray = originalArray.map(obj => ({ ...obj }));
Nach dem Login kopieren

4. Deep Copy von jQuery

Während die Extend-Methode von jQuery für flaches Kopieren verwendet werden kann, ist für eine Deep Copy die Erweiterung (true, {}, originalArray) erforderlich. Bei diesem Ansatz können jedoch Rekursionsprobleme auftreten.

Überlegungen zur Leistung

Die Leistung von Klonmethoden variiert je nach Komplexität und Struktur der Objekte. StructuredClone- und Spread-Operator sind im Allgemeinen effizienter. Benchmark-Ergebnisse für das Beispielarray im bereitgestellten Anhang zeigen, dass der Spread-Operator deutlich schneller als JSON.stringify ist, was ihn ideal für das flache Klonen von Objekten macht.

Schlussfolgerung

Der Die Wahl der Klonierungsmethode hängt von den spezifischen Anforderungen der Anwendung ab. Für das tiefe Klonen komplexer Objektstrukturen wird StructuredClone empfohlen. Für das flache Klonen serialisierbarer Objekte kann JSON.stringify oder der Spread-Operator-Ansatz verwendet werden.

Das obige ist der detaillierte Inhalt vonWie kann man Arrays von Objekten in JavaScript effektiv klonen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage