Detaillierte Beschreibung von Shallow Copy und Deep Copy in js

Vorwort:

Bevor wir den folgenden Artikel studieren, wollen wir kurz das Wissen über das Gedächtnis verstehen. Das Folgende ist eine kurze Einführung

1. js-Speicher

Der js-Speicher oder der Speicher der meisten Sprachen ist in Stapel und Heap unterteilt. Die Variablenwerte grundlegender Datentypen werden auf dem Stapel zugewiesen, und die Variablenwerte von Referenzdatentypen werden auf dem Heap zugewiesen. Der Stapel speichert nur die Adressen bestimmter Objekte im Heap.

2. Abtretung

Bei grundlegenden Datentypen handelt es sich bei der Zuweisungsoperation um eine Kopie, das heißt, die neuen und alten Variablen beeinflussen sich nicht gegenseitig.

var a = 1;
var b = a;
b = 2;
console.log(b); // 2

Bei Referenzdatentypen fügt die Zuweisungsoperation einfach eine Variable im Stapel hinzu, die auf das Objekt im Heap zeigt, d. h. sie kopiert die Referenzadresse. Die neuen und alten Variablen beeinflussen sich gegenseitig. Das heißt, wenn der Objektwert der neuen Variablen geändert wird, ändert sich auch der entsprechende Wert der alten Variablen.

var a = {
    Name: "Mike"
};
var b = a;
b.name = "Buchse";
konsole.log(a); // {name: "jack"}

3. Oberflächliche Kopie

Bei grundlegenden Datentypen und Daten ohne verschachtelte Objekte sind alle Vorgänge Kopiervorgänge und die neuen und alten Variablen beeinflussen sich nicht gegenseitig.

var a = {
    Name: "Mike"
};
var b = {};
b.name = a.name;
b.name = "Buchse";
console.log(a) // {name: "mike"}

Bei Daten mit verschachtelten Objekten kopiert eine oberflächliche Kopie jedoch nur die Objekte der ersten Ebene, und die Werte auf tieferen Ebenen sind weiterhin kopierte Referenzadressen.

var a = {
    Name: "Mike",
    Sprache:
        zuerst: "Englisch",
        zweitens: "chinesisch"
    }
};
var b = {};
b.name = a.name;
b.name = "Buchse";
b.Sprache = a.Sprache;
b.language.first = "Japanisch"
console.log(a) // { Sprache: {erste: "Japanisch", zweite: "Chinesisch"}}

js implementiert Shallow Copy. Die Idee ist : Durchlaufe jedes Attribut des target und weise den Attributnamen und -wert der neuen Variable zu.
Wenn Sie die Bedeutung der Zuweisung verstehen, wird in der vierten Codezeile, wenn der Wert von target[key] ein Objekt ist, die neue Variable durch Zuweisung zugewiesen, wodurch im Wesentlichen die Adresse des Referenzdatentyps im Heap kopiert wird. Es ist nicht schwer zu verstehen, warum eine flache Kopie unterschiedliche Ergebnisse liefert, je nachdem, ob es sich um ein verschachteltes Objekt handelt oder nicht.

Funktion flachKopie(Ziel) {
    lass Ergebnis = {};
    für (const key in target) {
        Ergebnis[Schlüssel] = Ziel[Schlüssel];
    }
    Ergebnis zurückgeben;
}

4. Tiefe Kopie

Eine tiefe Kopie ist eine vollständige Kopie und die neuen und alten Variablen beeinflussen sich nicht gegenseitig.
Es gibt unterschiedliche Verarbeitungsmethoden, je nachdem, ob der Parameter ein Objekt ist. Wenn es ein Objekt ist, wird jedes Attribut und jeder Wert des Objekts zugewiesen und dann rekursiv verarbeitet; andernfalls wird es direkt zurückgegeben.

Funktion Klon(Ziel) {
    wenn (Typ des Ziels === "Objekt") {
        //Beurteilen, ob es ein Array ist let result = Array.isArray(target)? [] : {};
        für (const key in target) {
            Ergebnis[Schlüssel] = Klon(Ziel[Schlüssel]);
        }
        Ergebnis zurückgeben;
    } anders {
        Rücklaufziel;
    }
}

Dies ist das Ende dieses ausführlichen Artikels über Shallow Copy und Deep Copy von Zuweisungen in js. Weitere relevante Inhalte über Shallow Copy und Deep Copy von Zuweisungen in js finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den verwandten Artikeln weiter unten. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!