Dieser Artikel teilt die flache Kopie und den Deep Copy Code von JavaScript -Objekten für Ihre Referenz. Der spezifische Inhalt ist wie folgt
1. Leichte Kopie
Kopie bedeutet, alle Eigenschaften des übergeordneten Objekts in das untergeordnete Objekt zu kopieren.
Die folgende Funktion ist das Kopieren:
var chinesisch = {nation: 'China'} var doctor = {career: 'doctor'} function extendCopy (p) {var c = {}; für (var i in p) {c [i] = p [i]; } C.uber = p; Rückkehr C; }Schreiben Sie bei der Verwendung Folgendes:
var doctor = extendCopy (chinesisch); doctor.career = 'doktor'; alarm (doktor.nation); // China
Es gibt jedoch ein Problem mit einer solchen Kopie. Das heißt, wenn die Eigenschaft des übergeordneten Objekts einem Array oder einem anderen Objekt entspricht, erhält das untergeordnete Objekt tatsächlich nur eine Speicheradresse, keine reale Kopie. Daher besteht die Möglichkeit, dass das übergeordnete Objekt manipuliert wird.
Bitte fügen Sie nun ein "Geburtsort" -Sicht zu Chinesisch hinzu, dessen Wert ein Array ist.
Chinese.Birthplaces = ['Peking', 'Shanghai', 'Hong Kong'];
Durch die ExtendCopy () -Funktion erbt der Arzt Chinesisch.
var doctor = extendCopy (chinesisch);
Dann fügen wir dem "Geburtsort" des Arztes eine Stadt hinzu:
Doktor.Birthplaces.push ('Xiamen');
Schauen Sie sich die Eingabeergebnisse an
Alarm (Doktor.Birthplaces); // Peking, Shanghai, Hongkong, Xiamen
Alarm (Chinese.Birthplaces); // Peking, Shanghai, Hongkong, Xiamen
Infolgedessen wurden beide Geburtshäuser verändert.
Daher kopiert ExtendCopy () nur Grundtypdaten, und wir nennen diese Kopie "flache Kopie".
2. Deep Copy
Da die flache und tiefe Kopie solche Nachteile aufweist, schauen wir uns als nächstes die tiefe Kopie an
Die sogenannte "tiefe Kopie" bedeutet, dass sie die tatsächliche Kopie von Arrays und Objekten realisieren kann. Seine Umsetzung ist nicht schwierig. Rufen Sie einfach "Shallow Copy" rekursiv an.
Funktion DeepCopy (p, c) {var c = c || {}; für (var i in p) {if (typeof p [i] === 'Objekt') {c [i] = (p [i] .Constructor === Array)? []: {}; DeepCopy (P [i], c [i]); } else {c [i] = p [i]; }} return c; }Schauen Sie sich an, wie man es benutzt:
var Doctor = DeepCopy (Chinese);
Fügen Sie nun das übergeordnete Objekt mit dem Wert als Array eine Eigenschaft hinzu. Ändern Sie dann diese Eigenschaft im untergeordneten Objekt:
Chinesische // Peking, Shanghai, Hongkong, Xiamen Alert (Chinese.Birthplaces); // Peking, Shanghai, Hongkong
Dadurch wird die Kopie abgeschlossen;
$ .extend ()
$ .extend () in jQuery ist gleich.
$ .extend ([Deep], Ziel, Object1 [, ObjectN])
•tief
Typ: boolean
Wenn wahr, wird die Zusammenführung rekursiv (auch als Deep Copy bezeichnet).
•Ziel
Typ: Objekt
Objekterweiterung. Dies wird neue Immobilien erhalten.
• Objekt1
Typ: Objekt
Ein Objekt, das zusätzliche Eigenschaften enthält, die in den ersten Parameter verschmolzen sind.
• Objektn
Typ: Objekt
Enthält zusätzliche Attribute, die sich in den ersten Parameter verschmelzen
Wenn wir $ .extend () zwei oder mehr Objekte bereitstellen, werden alle Eigenschaften des Objekts zum Zielobjekt (Zielparameter) hinzugefügt.
Wenn $ .extend () nur ein Parameter zur Verfügung gestellt wird, bedeutet dies, dass der Zielparameter weggelassen wird. In diesem Fall wird das JQuery -Objekt selbst standardmäßig zum Zielobjekt gesetzt. Auf diese Weise können wir neue Funktionen im Jquery -Namespace hinzufügen. Dies ist nützlich für Plugin -Entwickler, wenn sie JQuery neue Funktionen hinzufügen möchten.
Denken Sie daran, dass das Zielobjekt (erster Parameter) geändert und über $ .extend () zurückgegeben wird. Wenn wir jedoch das ursprüngliche Objekt behalten möchten, können wir ein leeres Objekt als Zielobjekt übergeben:
var Object = $ .extend ({}, Object1, Object2);
Standardmäßig ist der Zusammenführungsvorgang über $ .extend () nicht rekursiv; Wenn die Eigenschaft des ersten Objekts selbst ein Objekt oder ein Array ist, überschreibt sie eine Eigenschaft vollständig mit demselben Taste des zweiten Objekts. Diese Werte werden nicht zusammengeführt. Dies kann verstanden werden, indem der Wert der Banane im folgenden Beispiel überprüft wird. Wenn jedoch True als erstes Argument für die Funktion verwendet wird, werden rekursive Zusammenschlüsse am Objekt durchgeführt.
WARNUNG: Das falsche Bestand für den ersten Parameter wird nicht unterstützt.
1. Zusammenführen zwei Objekte und ändern Sie das erste Objekt.
var Object1 = {Apple: 0, Banane: {Gewicht: 52, Preis: 100}, Kirsche: 97}; var Object2 = {Banana: {Preis: 200}, Durian: 100}; // Object2 in Object1 $ $ .extend (Object1, Object2). ); // {"Apple": 0, "Banane": {"Preis": 200}, "Cherry": 97, "Durian": 100}2. Zusammenführen zwei Objekte in rekursiver Weise und ändern Sie das erste Objekt.
var Object1 = {Apple: 0, Banane: {Gewicht: 52, Preis: 100}, Cherry: 97}; var Object2 = {Banana: {Preis: 200}, Durian: 100}; // Object2 in Object1, rekursiv $ .EXTEND (true, Object1, Object2). Json.Stringify (Object1)); // {"Apple": 0, "Banana": {"Gewicht": 52, "Preis": 200}, "Kirsche": 97, "Durian": 100}Fucken Sie die Standard- und Optionsobjekte zusammen und ändern Sie das Standardobjekt nicht. Dies ist ein häufig verwendetes Plug-in-Entwicklungsmodell.
var defaults = {validate: false, limit: 5, name: "foo"}; var options = {validate: true, name: "bar"}; // Ferge Standards und Optionen, ohne die Standardeinstellungen zu ändern. ));console.log(JSON.stringify( settings ));//defaults -- {"validate":false,"limit":5,"name":"foo"}//options -- {"validate":true,"name":"bar"}//settings -- {"validate":true,"limit":5,"name":"bar"}JavaScript bestimmt, ob Objekte gleich sind
In JavaScript umfassen Gleichstellungsoperationen "==", "===" Konsistenz. Es besteht keine Notwendigkeit, die Mehrheit der Unterschiede zwischen den beiden zu geben. In diesem Artikel werden wir darüber sprechen, wie Sie feststellen können, ob zwei Objekte gleich sind? Sie könnten denken, wenn zwei Objekte die gleichen Eigenschaften haben und ihre Eigenschaften die gleichen Werte haben, sind die beiden Objekte gleich. Dann verwenden wir ein Beispiel, um zu demonstrieren:
var obj1 = {name: "benjamin", sex: "männlich"} var obj2 = {name: "benjamin", sex: "männlich"} // outputs: false secondso.log (obj1 == obj2); // Ausgänge: false secondSO.log (obj1 == -obj2);Aus dem obigen Beispiel können wir sehen, dass False zurückgegeben wird, ob Sie "==" oder "==" verwenden. Der Hauptgrund ist, dass die Zeichenfolge und die Anzahl der grundlegenden Typen nach Werten verglichen werden, während Objekte (Datum, Array) und gewöhnliche Objekte durch die Adresse im Speicher verglichen werden, auf die Zeiger hingewiesen werden. Siehe das folgende Beispiel:
var obj1 = {name: "benjamin", sex: "männlich"}; var obj2 = {name: "benjamin", sex: "männlich"}; var obj3 = obj1; // outs: trueconsole.log (obj1 == obj3); falseconsole.log (obj2 === obj3); // Ausgänge: falseconsole.log (obj2 === obj3);Das obige Beispiel gibt wahr zurück, da die Zeiger von OBJ1 und OB3 auf dieselbe Adresse im Speicher hinweisen. Es ähnelt dem Konzept des Wertpasses und der Verweise in objektorientierten Sprachen (Java/C ++). Wenn Sie feststellen möchten, ob zwei Objekte gleich sind, müssen Sie klar sein, ob die Eigenschaften der beiden Objekte gleich sind oder ob die Werte, die den Eigenschaften entsprechen, gleich oder was?
Funktionsperson (Name) {this.name = name; } var p1 = neue Person ("p1"); var p2 = neue Person ("p2"); console.log (p1 == p2); // false person.prototype.sayhi = function () {// do sayhi hier} console.log (p1.sayhi () == p2.sayhi ()); // true console.log (p1.sayhi () == p2.sayhi ()); // true console.log (p1.sayhi () === p2.sayhi ()); //WAHRDas obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, es wird für das Lernen aller hilfreich sein und ich hoffe, jeder wird Wulin.com mehr unterstützen.