Trying to add multiple properties to Javascript object using a loop

Question

I hope the day finds you well.

So I have an object with no properties. I'm trying to add multiple properties to this object using a loop. Each property added to the loop will appear in the object multiple times depending on how many times the loop runs, with each new property incremented by 1.

So I have something like this:

myObject = {  };

for(i = 0; i < 2; i++){
    myObject.propA + i = foo;
    myObject.propB + i = bar;
};

Which I want to yield something like this:

myObject.propA0 = foo;
myObject.propB0 = bar;
myObject.propA1 = foo;
myObject.propB2 = bar;

Giving a nice stack of objects generated on the fly depending on how many times the loop runs. But I don't seem to be getting this. So how exactly do I feed the variable from the loop to the property when it's created and assigned?

TommyBs · Accepted Answer · 2013-04-09 16:10:48Z

34

Try using square bracket notation for the names

   myObject['propa' + i] = foo;

answered Apr 9, 2013 at 16:10

TommyBs

9,7484 gold badges37 silver badges74 bronze badges

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

1 Comment

Jonathon Nordquist Over a year ago

This in fact did it, much obliged.

bfavaretto · Accepted Answer · 2013-04-09 17:15:56Z

13

As other users said, you have to use bracket notation to refer to properties by their name strings:

myObject['propA' + i] = 'foo';

But why don't you use an array of objects, instead of a single object with similar, numbered property names? Something like this:

var myArray = [];
for(i = 0; i < 2; i++){
    myArray.push({
        propA: 'foo',
        propB: 'bar'
    });
};

This should produce:

[
    { propA: 'foo', propB: 'bar'},
    { propA: 'foo', propB: 'bar'}
]

It looks way cleaner, in my opinion.

edited Apr 9, 2013 at 17:15

answered Apr 9, 2013 at 16:21

bfavaretto

72k18 gold badges118 silver badges162 bronze badges

Comments

Chris Tonkinson · Accepted Answer · 2013-04-09 16:11:21Z

7

Use the array-access method to set the properties.

myObject = {  };

for(i = 0; i < 2; i++){
    myObject['propA' + i] = foo;
    myObject['propB' + i] = bar;
};

answered Apr 9, 2013 at 16:11

Chris Tonkinson

14.6k14 gold badges62 silver badges92 bronze badges

1 Comment

Jonathon Nordquist Over a year ago

This has proved useful as well, some of the objects in my current project work better as groups of arrays.

Halcyon · Accepted Answer · 2013-04-09 16:18:01Z

1

you might use

object['popA'+i]=...

to create a standard property or either use a getter/setter property, in this case you need to use

Object.defineProperty(object, *propertyname*, *propertyDescriptor*).

The latter gives you more options on the created property.

All details here :
https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/defineProperty

edited Apr 9, 2013 at 16:18

Halcyon

57.7k10 gold badges93 silver badges131 bronze badges

answered Apr 9, 2013 at 16:14

GameAlchemist

19.3k7 gold badges38 silver badges59 bronze badges

Collectives™ on Stack Overflow

Trying to add multiple properties to Javascript object using a loop

4 Answers 4

1 Comment

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related