Wie klont man ein Array von Objekten in JavaScript?

Question

...wo jedes Objekt auch Verweise auf andere Objekte innerhalb desselben Arrays hat?

Als ich zum ersten Mal mit diesem Problem konfrontiert wurde, dachte ich nur an etwas wie

var clonedNodesArray = nodesArray.clone()

existieren würde, und suchte nach Informationen darüber, wie man Objekte in JavaScript klont. Ich habe gefunden eine Frage auf Stack Overflow (beantwortet von demselben @JohnResig) und er wies darauf hin, dass man mit jQuery Folgendes tun kann

var clonedNodesArray = jQuery.extend({}, nodesArray);

um ein Objekt zu klonen. Ich habe dies jedoch ausprobiert, und es werden nur die Referenzen der Objekte im Array kopiert. Wenn ich also

nodesArray[0].value = "red"
clonedNodesArray[0].value = "green"

wird der Wert sowohl von nodesArray[0] als auch von clonedNodesArray[0] "grün" sein. Dann habe ich versucht

var clonedNodesArray = jQuery.extend(true, {}, nodesArray);

das ein Objekt tief kopiert, aber ich bekomme " zu viel Rekursion " und " Kontrollstapelüberlauf " Nachrichten von beiden Firebug y Oper Libelle beziehungsweise.

Wie würden Sie das machen? Ist das etwas, das gar nicht gemacht werden sollte? Gibt es eine wiederverwendbare Möglichkeit, dies in JavaScript zu tun?

Answer 1

Das funktioniert bei mir:

var clonedArray = $.map(originalArray, function (obj) {
                      return $.extend({}, obj);
                  });

Und wenn Sie eine tiefe Kopie der Objekte im Array benötigen:

var clonedArray = $.map(originalArray, function (obj) {
                      return $.extend(true, {}, obj);
                  });

Answer 2

Wenn Sie einen tiefen Klon implementieren wollen, verwenden Sie JSON.parse(JSON.stringify(Ihr {} oder [])) :

const myObj ={
    a: 1,
    b: 2,
    b: 3
}

const deepClone = JSON.parse(JSON.stringify(myObj));
deepClone.a = 12;
console.log("deepClone-----"+myObj.a);
const withOutDeepClone = myObj;
withOutDeepClone.a = 12;
console.log("withOutDeepClone----" + myObj.a);

Answer 3

$.evalJSON($.toJSON(origArray));

Answer 4

Lodash hat die cloneDeep Funktion für diese Zwecke:

var objects = [{ 'a': 1 }, { 'b': 2 }];
var deep = _.cloneDeep(objects);

Answer 5

Karte erstellt ein neues Array aus dem alten (ohne Verweis auf das alte), und innerhalb der Karte erstellen Sie ein neues Objekt und iterieren über Eigenschaften (Schlüssel) und weisen den entsprechenden Eigenschaften des neuen Objekts Werte aus dem alten Array-Objekt zu.

Dadurch wird genau das gleiche Array von Objekten erstellt.

let newArray = oldArray.map(a => {
               let newObject = {};
               Object.keys(a).forEach(propertyKey => {
                    newObject[propertyKey] = a[propertyKey];
               });
               return newObject;
});