LabEx
LoginBeitreten

Tiefe Klonierung von Objekten

Beginner

This tutorial is from open-source community. Access the source code

Einführung

In diesem Lab werden wir lernen, wie man in JavaScript eine tiefe Kopie eines Objekts erstellt. Wir werden Rekursion verwenden, um primitve Werte, Arrays und Objekte zu klonen, während Klasseninstanzen ausgeschlossen werden. Am Ende dieses Labs werden Sie in der Lage sein, eine vollständige Kopie eines Objekts zu erstellen, ohne das ursprüngliche Objekt zu verändern.

Dies ist ein Guided Lab, das schrittweise Anweisungen bietet, um Ihnen beim Lernen und Üben zu helfen. Befolgen Sie die Anweisungen sorgfältig, um jeden Schritt abzuschließen und praktische Erfahrungen zu sammeln. Historische Daten zeigen, dass dies ein Labor der Stufe Anfänger mit einer Abschlussquote von 92% ist. Es hat eine positive Bewertungsrate von 100% von den Lernenden erhalten.

Anweisungen zur tiefen Klonierung eines Objekts

Um ein Objekt tief zu klonen, folgen Sie diesen Schritten:

  1. Öffnen Sie eine neue Terminal-/SSH-Instanz und geben Sie node ein, um mit der Codeausführung zu beginnen.
  2. Verwenden Sie Rekursion, um primitve Werte, Arrays und Objekte zu klonen, wobei Klasseninstanzen ausgeschlossen werden.
  3. Überprüfen Sie, ob das übergebene Objekt null ist, und geben Sie im positiven Fall null zurück.
  4. Verwenden Sie Object.assign() und ein leeres Objekt ({}), um eine flache Kopie des Ursprungs zu erstellen.
  5. Verwenden Sie Object.keys() und Array.prototype.forEach(), um zu bestimmen, welche Schlüssel-Wert-Paare tief geklont werden müssen.
  6. Wenn das Objekt ein Array ist, legen Sie die length des clone auf die Länge des Ursprungs fest und verwenden Sie Array.from(), um eine Kopie zu erstellen.
  7. Verwenden Sie den folgenden Code, um die tiefe Klonierung zu implementieren:
const deepClone = (obj) => {
  if (obj === null) return null;
  let clone = Object.assign({}, obj);
  Object.keys(clone).forEach(
    (key) =>
      (clone[key] =
        typeof obj[key] === "object" ? deepClone(obj[key]) : obj[key])
  );
  if (Array.isArray(obj)) {
    clone.length = obj.length;
    return Array.from(clone);
  }
  return clone;
};

Verwenden Sie den folgenden Code, um Ihre Funktion zur tiefen Klonierung zu testen:

const a = { foo: "bar", obj: { a: 1, b: 2 } };
const b = deepClone(a); // a!== b, a.obj!== b.obj

Zusammenfassung

Herzlichen Glückwunsch! Sie haben das Lab "Tiefe Klonierung von Objekten" abgeschlossen. Sie können in LabEx weitere Labs absolvieren, um Ihre Fähigkeiten zu verbessern.