Dodaj właściwość do tablicy obiektów


110

Mam tablicę obiektów, jak pokazano poniżej

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

Chcę dodać jeszcze jedną właściwość o nazwie Active do każdego elementu tej tablicy obiektów.

Ostateczny wynik powinien wyglądać następująco.

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"

Czy ktoś może mi dać znać, jak to osiągnąć.


6
Zapętlić tablicę. Dodaj właściwości do każdego elementu tablicy podczas wykonywania pętli. Którą część nie wiesz, jak to zrobić?
JJJ

Odpowiedzi:


158

Możesz użyć tej forEachmetody do wykonania podanej funkcji raz dla każdego elementu tablicy. W tej dostarczonej funkcji możesz dodać Activewłaściwość do elementu.

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

224

albo użyj map

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

Edytowane w celu uwzględnienia komentarza @adrianolsk, aby nie modyfikować oryginału i zamiast tego zwracać nowy obiekt dla każdego.

Przeczytaj specyfikację


4
obsługiwane tylko w ES6
Amaynut

5
ES5 by być precyzyjnym;) - ale Babel szczęśliwie to
zdekompiluje

51
map powinien zwrócić nową tablicę nie mutować obiektu, w tym przypadku forEach byłoby lepsze, lub użyć map i zwrócić nowy obiektResults.map(obj=> ({ ...obj, Active : 'false' }))
adrianolsk

4
Świetne rozwiązanie @adrianolsk, prześlij to jako osobną odpowiedź.
Michael Hays


1

Natknąłem się również na ten problem i próbując go rozwiązać, ciągle zawieszałem kartę Chrome, na której była uruchomiona moja aplikacja. Wygląda na to, że winowajcą był operator spreadu dla obiektów .

Z niewielką pomocą komentarza Adrianolska i powyższej odpowiedzi sidonaldsona, użyłem Object. assign () jako wynik operatora spreadu z babel, na przykład:

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);
});

0

Przechodzi przez obiekt jako struktura klucz-wartość. Następnie doda nową właściwość o nazwie „Aktywna” i przykładową wartość tej właściwości („Aktywna”) do każdego obiektu wewnątrz tego obiektu. ten kod można zastosować zarówno do tablicy obiektów, jak i do obiektów obiektów.

   Object.keys(Results).forEach(function (key){
            Object.defineProperty(Results[key], "Active", { value: "the appropriate value"});
        });

Tak, oczywiście, przechodzi przez obiekt jako struktura klucz-wartość. Następnie doda nową właściwość o nazwie „Aktywny” i przykładową wartość do każdego obiektu wewnątrz tego obiektu. ten kod można zastosować zarówno do tablicy obiektów, jak i do obiektów obiektów.
Arash MAS

0

Dzięki ES6 możesz po prostu:

 for(const element of Results) {
      element.Active = "false";
 }
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.