How to create dynamic array element names in JavaScript, inside a for loop?

Question

I have a for loop in a JS snippet and I want to dynamically generate the array members' names, based on a string and the current iteration number. Basically I have written something like this:

product_data[i] = {
  "ch-" + i: '1',
  'product' + i: jsondata[products][i].product_description,
  'quantity' + i: jsondata[products][i].quantity,
  'price' + i: jsondata[products][i].unit_price,
  'rem' + i: '',
  'fpa' + i: jsondata[products][i].vat
};

however, it's not working at all. I've used eval() without any luck too. Any ideas?

Before we give you the answer, are you sure you want to do that? When dealing with arrays you deal with a list of the same types. if you are going to change it such that each indexed item has a different set of keys, maybe there is a different way. — Fallenreaper
– Fallenreaper, Commented Nov 3, 2016 at 18:09
@DmitryYudin I don't believe the json data are necessary. It could be something as simple as the iteration number itself. — Arkoudinos
– Arkoudinos, Commented Nov 3, 2016 at 18:12
I'm a bit wary of this approach also. Perhaps storing an (unique?) id in the object hash would be a simpler approach. — Aubricus
– Aubricus, Commented Nov 3, 2016 at 18:13

canon · Accepted Answer · 2016-11-07 14:22:14Z

1

If supported in your environment, you can use the new ECMAScript notation for computed property names in object initializers:

var product_data = new Array(2);

for (var i = 0; i < 2; i++) {
  product_data[i] = {
    ["ch-" + i]: i,
  };
}

console.log(product_data);

Otherwise, you can use good ol' bracket notation, like so:

var product_data = new Array(2);

for (var i = 0; i < 2; i++) {
  product_data[i] = {};
  product_data[i]["ch-" + i] = i;
}

console.log(product_data);

edited Nov 7, 2016 at 14:22

answered Nov 3, 2016 at 18:13

canon

41.9k10 gold badges77 silver badges102 bronze badges

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

Comments

iuliu.net · Accepted Answer · 2016-11-03 18:20:09Z

1

This features exists since ES6. You can use it like so:

var obj = {
  [myKey]: value,
}

So your example becomes:

product_data[i] = {
               ["ch-" + i]: '1',
               ['product' + i]: jsondata[products][i].product_description,
               ['quantity' + i]: jsondata[products][i].quantity,
               ['price' + i]: jsondata[products][i].unit_price,
               ['rem' + i]: '',
               ['fpa' + i]: jsondata[products][i].vat
               };

If you want to don't want to use EcmaScript 6, you'll have to initialize your object as an empty one and then add the properties to it:

product_data[i] = {};
product_data[i]["ch-" + i] = '1'
...

answered Nov 3, 2016 at 18:20

iuliu.net

7,1858 gold badges52 silver badges72 bronze badges

1 Comment

Arkoudinos Over a year ago

Thank you also for your answer! Left upvote, but I have too small rep yet to be recorded ;)

sergio0983 · Accepted Answer · 2016-11-03 18:23:47Z

-1

You can do it like this

product_data[i] = {};
product_data[i]["ch-"+i] = '1';
product_data[i]["product"+i] = jsondata[products][i].product_description;
...

And so on...

answered Nov 3, 2016 at 18:23

sergio0983

1,2988 silver badges20 bronze badges

Collectives™ on Stack Overflow

How to create dynamic array element names in JavaScript, inside a for loop?

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related