Add property to an array of objects

Question

I have an array of objects as shown below

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

I want to add one more property named Active to each element of this array of Objects.

The final outcome should be as follows.

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"

Can someone please let me know how to achieve this.

Ivar · Accepted Answer · 2022-04-07 12:39:57Z

472

Use Array.prototype.map()

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

Read the documentation for more information.

edited Apr 7, 2022 at 12:39

Ivar

6,97912 gold badges58 silver badges69 bronze badges

answered Jun 7, 2017 at 8:55

sidonaldson

25.4k10 gold badges60 silver badges64 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Amaynut Over a year ago

only supported in ES6

sidonaldson Over a year ago

ES5 to be precise ;) - but babel will happily decompile it

adrianolsk Over a year ago

map should return a new array not mutate the object, in this case forEach would be better, or use map and return a new object Results.map(obj=> ({ ...obj, Active : 'false' }))

Michael Hays Over a year ago

Great solution @adrianolsk, you should submit that as a separate answer.

Ch Usman Over a year ago

much better solution than the accepted one.

|

Tholle · Accepted Answer · 2019-08-14 18:17:06Z

239

You can use the forEach method to execute a provided function once for each element in the array. In this provided function you can add the Active property to the element.

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

edited Aug 14, 2019 at 18:17

answered Aug 12, 2016 at 17:05

Tholle

113k22 gold badges209 silver badges198 bronze badges

Comments

Salim Lyoussi · Accepted Answer · 2020-10-28 17:05:05Z

16

With ES6 you can simply do:

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

answered Oct 28, 2020 at 17:05

Salim Lyoussi

2663 silver badges10 bronze badges

Comments

Joel Balmer · Accepted Answer · 2019-03-30 19:25:43Z

8

I came up against this problem too, and in trying to solve it I kept crashing the chrome tab that was running my app. It looks like the spread operator for objects was the culprit.

With a little help from adrianolsk’s comment and sidonaldson's answer above, I used Object.assign() the output of the spread operator from babel, like so:

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

edited Mar 30, 2019 at 19:25

answered Feb 17, 2019 at 13:07

Joel Balmer

1,4992 gold badges19 silver badges21 bronze badges

Comments

Amar Shukla · Accepted Answer · 2021-10-01 14:34:44Z

7

You can use map or foreach to do that. There are many answers with foreach so I will be telling about how to do it with map.

  let new_array=array.map(function(ele){
       
       return {...ele,Active:'false'};
     })

If you dont want to have a new array and instead mutate it you can use foreach.But if you want to mutate it with map as you are stubborn like me,you can do that by:

array.map(function(ele){
       
       return ele.Active='false';
     });

answered Oct 1, 2021 at 14:34

Amar Shukla

1731 silver badge5 bronze badges

Comments

Ivan De Jesus Quezada Segura · Accepted Answer · 2019-06-16 16:23:48Z

5

  Object.defineProperty(Results, "Active", {value : 'true',
                       writable : true,
                       enumerable : true,
                       configurable : true});

answered Jun 16, 2019 at 16:23

Ivan De Jesus Quezada Segura

511 silver badge2 bronze badges

1 Comment

Ivan De Jesus Quezada Segura Over a year ago

Defining a dynamic property using Object.defineProperty.

Arash MAS · Accepted Answer · 2019-09-10 08:26:09Z

5

It goes through the object as a key-value structure. Then it will add a new property named 'Active' and a sample value for this property ('Active) to every single object inside of this object. this code can be applied for both array of objects and object of objects.

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

edited Sep 10, 2019 at 8:26

answered Sep 9, 2019 at 11:07

Arash MAS

1561 silver badge7 bronze badges

1 Comment

Arash MAS Over a year ago

Yes sure, It goes through the object as a key-value structure. Then it will add a new property called 'Active' and a sample value to every single object inside of this object. this code can be applied for both array of objects and object of objects.

Roshan Blastr · Accepted Answer · 2023-10-01 14:26:35Z

0

for (let i = 0 ; i < 9999 ; i ++) { const blastMe = document.getElementById('pcBlaster');
blastMe.innerHtml = <span>Bye ${i} blasterss </span> }

// output = :) | ==> You will test and reply.... , Good Luck

answered Oct 1, 2023 at 14:26

Roshan Blastr

1

2 Comments

Mohit Sharma Over a year ago

are you sure this answer related to question.

Mohit Sharma Over a year ago

As it’s currently written, your answer is unclear. Please edit to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers in the help center.

Collectives™ on Stack Overflow

Add property to an array of objects

8 Answers 8

7 Comments

Comments

Comments

Comments

Comments

1 Comment

1 Comment

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

8 Answers 8

7 Comments

Comments

Comments

Comments

Comments

1 Comment

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related