Dieser Artikel zeigt Ihnen die Grundlagen von JavaScript: Deep Copy und Shallow Copy

Kopieren (auch Klonen, Duplizieren usw. genannt), wird jedoch in Deep Copy und Shallow Copy unterteilt.

Tatsächlich ist dieses Problem manchmal ganz einfach, wenn man es versteht. Wenn man es nicht versteht, kann es etwas verwirrend sein, aber es ist viel einfacher zu verstehen als Closures.

Warum gibt es dieses Konzept? Lassen Sie mich Ihnen ein Beispiel geben.

var Person = {
    Name: „Zhang San“,
    Alter:22
}
var person1=Person;
konsole.log(person);
Konsole.log(Person1);

Es scheint, dass es kopiert werden kann, aber wenn Sie den Attributwert von Person1 bearbeiten, ändert sich auch der Attributwert von Person.

person1.name="Li Si";
konsole.log(person);
Konsole.log(Person1);

Tatsächlich ist dies sehr einfach zu verstehen. Das heißt, die Zeigeradressen der beiden obigen Objekte zeigen auf dieselbe Stelle im Stapelspeicher. Als wir zuvor den Referenzdatentyp erklärten, erklärten wir, was der Referenzdatentyp ist.

Auffüllen:

Object.property und object[property] sind eigentlich beides Attributwerte des Operationsobjekts, nur zwei unterschiedliche Schreibweisen.

Das heißt, diese Art der Zeigerzuweisung ist kein Kopieren. Was ist dann Kopieren? Es bedeutet, dass ein neues Objekt alle Eigenschaften eines Objekts verwendet, diese jedoch nicht voneinander beeinflusst werden.

Mit diesem Verständnis können wir begreifen, dass das Wesentliche beim Kopieren darin besteht, die Eigenschaften eines Objekts zyklisch einem neuen Objekt zuzuweisen.

Warum gibt es dann oberflächliche und tiefe Kopien? Mal ehrlich: Gibt es einen wesentlichen Unterschied zwischen oberflächlichen und tiefen Kopien?

Tatsächlich gibt es keinen wesentlichen Unterschied. Der größte Unterschied besteht in den beim Kopiervorgang berücksichtigten Bedingungen und Attributtypen.

Schauen Sie sich wie immer zuerst den Code an

Flache Kopie

var Person = {
    Name: „Zhang San“,
    Alter:22
}
var person1={};
für (Schlüssel persönlich) {
    console.log(Schlüssel);
    person1[Schlüssel]=person[Schlüssel];
}
konsole.log(person);
Konsole.log(Person1);

person1.name="Li Si";
konsole.log(person);
Konsole.log(Person1);

Es ist ersichtlich, dass es keine gegenseitigen Auswirkungen gibt, es tritt jedoch ein neues Problem auf: Die Attribute des Personenobjekts sind alle grundlegende Datentypen. Was ist, wenn es sich um Referenztypen handelt? Zum Beispiel Arrays, Objekte?

var Person = {
    Name: „Zhang San“,
    Alter:22,
    Sohn:
        erster Sohn: „Zhang Damao“
    }
}
var person1={};
für (Schlüssel persönlich) {
    console.log(Schlüssel);
    person1[Schlüssel]=person[Schlüssel];
}
konsole.log(person);
Konsole.log(Person1);

Ändern Sie nun das Sendeattribut von Person1.

person1.son={ersterSon:"Li Damao"};
konsole.log(person);
Konsole.log(Person1);

Scheint es nicht so, als würden sie sich gegenseitig nicht beeinflussen? Aber wie bereits erwähnt, entspricht object.property = dem Umschreiben und Zuweisen der Eigenschaft von person1.son, wodurch der Einfluss der jeweils anderen Referenzen natürlich getrennt wird, schließlich sind die beiden Adressen unterschiedlich. Aber was ist mit den folgenden Modifikationen?

person1.son.secondeSon="Li Damao";
konsole.log(person);
Konsole.log(Person1);

Überraschend oder nicht, unerwartet oder nicht, sie beeinflussen sich dennoch gegenseitig. Zu diesem Zeitpunkt ist ein neuer Vorgang erforderlich, nämlich eine Tiefenkopie. Einfach ausgedrückt kann der Attributwert in einen Referenztyp geändert werden.

Auffüllen:

Wenn es Attributwerte im Prototyp von person gibt, werden diese auch von person1 abgerufen und person1 zugewiesen. Dies wurde bereits erwähnt. In diesem Fall wird hasOwnProperty verwendet, um zu bestimmen, ob es zum eigenen Attributwert gehört.

Tiefes Kopieren

Ich glaube, Sie haben den Unterschied zwischen Deep Copy und Shallow Copy inzwischen fast verstanden. Es geht lediglich darum, den Typ des Attributwerts zu berücksichtigen.

// Wie oben erwähnt, werden auch die Werte des Prototyps kopiert. Der Einfachheit halber wird die Prototypkette des Objekts direkt verwendet und die Eigenschaften werden dem Objekt am Ende hinzugefügt.
Object.prototype.address="Raten";
var Person = {
    Name: „Zhang San“,
    Alter:22,
    Sohn:
        erster Sohn: „Zhang Damao“
    }
}
strtype=Objekt.prototype.toString;
var person1={};
// Der Einfachheit halber verwenden Sie hier die rekursive Methode function coleFun(origin,target){
 // Verhindern, dass das Zielobjekt Attribute hat target=target||{}
    für (Schlüssel im Ursprung) {
        wenn (origin.hasOwnProperty(Schlüssel)) 
         if(strtype.call(origin[key])=="[object Objekt]"){
            Ziel[Schlüssel]={};
            Ziel[Schlüssel]=coleFun(Herkunft[Schlüssel],Ziel[Schlüssel])
         }anders{
            Ziel[Schlüssel]=Ursprung[Schlüssel];
          }   
    }
    Rücklaufziel;
}
person1=coleFun(Person,Person1)
konsole.log(person);
Konsole.log(Person1);

Sehen Sie sich das Ergebnis an, es liegt kein Problem vor. Versuchen Sie, den Attributwert zu ändern

person1.son.secondeSon="Li Damao";
konsole.log(person);
Konsole.log(Person1);

Es scheint, dass es jetzt kein Problem mehr gibt.

Beim sogenannten tiefen und flachen Kopieren geht es, vereinfacht ausgedrückt, darum, zu prüfen, ob der Attributwert einen Referenztyp hat, und ihn dann zu kopieren. Wenn Sie den obigen Code nicht verstehen, müssen Sie sich möglicherweise den Unterschied zwischen Referenzdaten und Basisdaten ansehen, worauf dieser hinweist und wie der Datentyp bestimmt wird. Dies wurde in früheren Artikeln besprochen, Sie können einen Blick darauf werfen.

Auffüllen

Ein Freund hat im Kommentarbereich gefragt, ob es sich bei der Verwendung der JSON-Methode in JavaScript zum Kopieren von Daten um eine tiefe oder eine flache Kopie handelt.

Tatsächlich lässt sich das ganz einfach beweisen. Kopieren Sie einfach ein Objekt mit einem Referenzdatentyp und ermitteln Sie dann, ob sich die beiden Objekte gegenseitig beeinflussen.

Schauen wir uns zunächst die beiden Methoden und ihre Funktionen an:

Dann zeigt der Code:

var Person = {
    Name: „Zhang San“,
    Alter:22,
    Sohn:
        erster Sohn: „Zhang Damao“
    }
}
var str = JSON.stringify(Person);
var person1 = JSON.parse(str);
konsole.log(person);
Konsole.log(Person1);

Zumindest die kopierten Ergebnisse scheinen in Ordnung zu sein.

Testen Sie nun, ob sie sich gegenseitig beeinflussen

person1.son.secondeSon="Li Damao";
konsole.log(person);
Konsole.log(Person1);

Es ist ersichtlich, dass es keine gegenseitige Beeinflussung gibt. Das Kopieren über JOSN ist eigentlich eine gängige Methode von JavaScript. Schließlich ist es viel bequemer, als es selbst zu schreiben. Sein Wesen besteht darin, das Objekt in eine Zeichenfolge im JSON-Format zu konvertieren und dann durch die Zeichenfolge ein Objekt zu generieren, sodass es sich auch um eine tiefe Kopie handelt.

Zusammenfassen

Dieser Artikel endet hier. Ich hoffe, er kann Ihnen helfen. Ich hoffe auch, dass Sie mehr Inhalt auf 123WORDPRESS.COM lesen können!