Wie klont man JavaScript-Objekte perfekt?

So duplizieren Sie JavaScript-Objekte genau

Die integrierten Methoden von JavaScript können die präzise Duplizierung von Objekten nicht garantieren. Dies ist auf das Vorhandensein von vom Prototyp abgeleiteten Eigenschaften und versteckten Attributen zurückzuführen, die beim Klonen zu unvorhergesehenen Ergebnissen führen können. Um dieses Problem anzugehen, wurden verschiedene Ansätze entwickelt.

Update 2022: Strukturiertes Klonen

Ein neuer JS-Standard namens strukturiertes Klonen bietet eine unkomplizierte Lösung. Es wird von vielen modernen Browsern unterstützt und ermöglicht eine genaue Duplizierung mit der folgenden Syntax:

const clone = structuredClone(object);

Traditioneller Ansatz

In früheren Versionen von JavaScript eine benutzerdefinierte Klonfunktion kann mit den folgenden Schritten implementiert werden:

1. Umgang mit nicht aufzählbaren Eigenschaften: Verwenden Sie zum Überspringen die Methode hasOwnProperty Prototypeigenschaften und konzentrieren Sie sich auf diejenigen, die direkt am Objekt definiert sind.
2. Klonen nicht aufzählbarer Attribute: Kopieren Sie explizit versteckte Eigenschaften, wenn ihre Namen bekannt sind, z. B. Prototyp oder __proto__.
3. Prototypvererbung konfigurieren: Stellen Sie sicher, dass der Prototyp des kopierten Objekts mit dem Original übereinstimmt. Dies erfordert möglicherweise eine manuelle Einstellung oder den Aufruf des Konstruktors des Quellobjekts.
4. Behandlung nicht aufzählbarer Datenstrukturen: Für Datenstrukturen mit nicht aufzählbaren Elementen, wie z. B. Datumsobjekten, ist eine spezielle Behandlung erforderlich.
5. Umgang mit zyklischen Strukturen: Vermeiden Sie eine unendliche Rekursion, indem Sie besuchte Objekte verfolgen und Referenzen teilen, anstatt tief zu klonen.

Ein Beispiel für eine Klonfunktion die diese Herausforderungen angeht, finden Sie unten:

function clone(obj) {
    if (null == obj || "object" != typeof obj) return obj;

    // Handing different object types
    // ... implementation for Date, Array, and Object

    // Generic fallback: deep copy properties
    var copy = {};
    for (var attr in obj) {
        if (obj.hasOwnProperty(attr)) copy[attr] = clone(obj[attr]);
    }
    return copy;
}

Diese Funktion geht davon aus, dass das Objekt eine Baumstruktur bildet und keine zyklischen Referenzen enthält. Der Umgang mit zyklischen Strukturen erfordert einen komplexeren Ansatz.

Das obige ist der detaillierte Inhalt vonWie klont man JavaScript-Objekte perfekt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!