Fügen Sie einem Array von Objekten eine Eigenschaft hinzu

109

Ich habe eine Reihe von Objekten wie unten gezeigt

Object {Results:Array[2]}
     Results:Array[2]
[0-1]
0:Object
       id=1     
       name: "Rick"
1:Object
       id=2     
       name:'david'

Ich möchte jedem Element dieses Array von Objekten eine weitere Eigenschaft mit dem Namen Active hinzufügen.

Das Endergebnis sollte wie folgt sein.

Object {Results:Array[2]}
     Results:Array[2]
[0-1]
0:Object
       id=1     
       name: "Rick"
       Active: "false"
1:Object
       id=2     
       name:'david'
       Active: "false"

Kann mir bitte jemand mitteilen, wie dies erreicht werden kann?

Patrick
quelle
6
Durchlaufen Sie das Array. Fügen Sie jedem Array-Element während der Schleife Eigenschaften hinzu. Welchen Teil wissen Sie nicht, wie es geht?
JJJ

Antworten:

153

Mit dieser forEachMethode können Sie eine bereitgestellte Funktion für jedes Element im Array einmal ausführen. In dieser bereitgestellten Funktion können Sie die ActiveEigenschaft zum Element hinzufügen .

Results.forEach(function (element) {
  element.Active = "false";
});
Tholle
quelle
215

oder verwenden map

Results.map(obj=> ({ ...obj, Active: 'false' }))

Bearbeitet, um den Kommentar von @adrianolsk wiederzugeben, um das Original nicht zu mutieren und stattdessen für jedes ein neues Objekt zurückzugeben.

Lesen Sie die Spezifikation

Sidonaldson
quelle
4
nur unterstützt in ES6
Amaynut
5
ES5 um genau zu sein;) - aber Babel wird es gerne dekompilieren
Sidonaldson
51
map sollte ein neues Array zurückgeben, das das Objekt nicht mutiert, in diesem Fall wäre forEach besser, oder map verwenden und ein neues Objekt zurückgebenResults.map(obj=> ({ ...obj, Active : 'false' }))
adrianolsk
4
Tolle Lösung @adrianolsk, das sollten Sie als separate Antwort einreichen.
Michael Hays
2
  Object.defineProperty(Results, "Active", {value : 'true',
                       writable : true,
                       enumerable : true,
                       configurable : true});
Ivan De Jesus Quezada Segura
quelle
Definieren einer dynamischen Eigenschaft mit Object.defineProperty.
Ivan De Jesus Quezada Segura
1

Ich bin auch auf dieses Problem gestoßen, und als ich versuchte, es zu lösen, stürzte ich immer wieder die Chrome-Registerkarte ab, auf der meine App ausgeführt wurde. Es sieht so aus, als ob der Spread-Operator für Objekte der Schuldige war.

Mit ein wenig Hilfe von Adriansolsks Kommentar und Sidonaldsons Antwort oben habe ich Object.assign () verwendet, um die Ausgabe des Spread-Operators von babel wie folgt auszugeben:

this.options.map(option => {
  // New properties to be added
  const newPropsObj = {
    newkey1:value1,
    newkey2:value2
  };

  // Assign new properties and return
  return Object.assign(option, newPropsObj);
});
Joel Balmer
quelle
0

Es geht durch das Objekt als Schlüsselwertstruktur. Anschließend wird jedem einzelnen Objekt in diesem Objekt eine neue Eigenschaft mit dem Namen "Aktiv" und ein Beispielwert für diese Eigenschaft ("Aktiv") hinzugefügt. Dieser Code kann sowohl für ein Array von Objekten als auch für ein Objekt von Objekten angewendet werden.

   Object.keys(Results).forEach(function (key){
            Object.defineProperty(Results[key], "Active", { value: "the appropriate value"});
        });
Arash MAS
quelle
Ja sicher, es geht durch das Objekt als Schlüsselwertstruktur. Anschließend wird jedem einzelnen Objekt in diesem Objekt eine neue Eigenschaft mit dem Namen "Aktiv" und ein Beispielwert hinzugefügt. Dieser Code kann sowohl für ein Array von Objekten als auch für ein Objekt von Objekten angewendet werden.
Arash MAS
0

Mit ES6 können Sie einfach Folgendes tun:

 for(const element of Results) {
      element.Active = "false";
 }
Salim Lyoussi
quelle