How do I fix this simple Javascript 'for loop'?

Question

I have a number of Javascript objects.

I want a simple 'for loop' (in JS) that prints out the key:value pairs within each object.

I've shown what I've done below (and here it is in a FIDDLE), but the variable 'thisvar' isn't working.

I'm obviously missing something really simple - can you point out what it is?

Thanks

// declare objects
var variant1 = {};
var variant2 = {};
variant1['a'] = 'apple';
variant1['b'] = 'orange';
variant1['c'] = 'pear';
variant2['a'] = 'red';
variant2['b'] = 'green';
variant2['c'] = 'blue';
// run through each object
for (i=1; i<3; i++){
 var thisvar = variant+i;
 for(var newindex in thisvar) {
 var name = newindex;
 var contents = thisvar[newindex];
 alert(name+'='+contents);
 }
}

​

• Felix Kling: var thisvar = variant+i; you cannot create dynamic variables like that.

Answer 1

// declare objects
var container = {
 variant1: {}
 variant2: {}
}
container.variant1['a'] = 'apple';
container.variant1['b'] = 'orange';
container.variant1['c'] = 'pear';
container.variant2['a'] = 'red';
container.variant2['b'] = 'green';
container.variant2['c'] = 'blue';
// run through each object
for (var i = 1; i < 3; i++){
 for (prop in container["variant"+i]){
 if (variant.hasOwnProperty(prop)){
 alert(prop+'='+var[prop]);
 }
 }
}

As pointed out in the comments below, if you want to numerically iterate over the properties, you're better off just using an array:

// declare objects
var variants = [{},{}];
variants[0]['a'] = 'apple';
variants[0]['b'] = 'orange';
variants[0]['c'] = 'pear';
variants[1]['a'] = 'red';
variants[1]['b'] = 'green';
variants[1]['c'] = 'blue';
// run through each object
for (var i = 0; i < 2; i++){
 for (prop in variants[i]){
 if (variant.hasOwnProperty(prop)){
 alert(prop+'='+var[prop]);
 }
 }
}

• Felix Kling: Only works with global variables, just sayin'. OP is better off using an array of objects.
• user1726343: @FelixKling I'm assuming you meant object map of objects. Fixed my answer.
• Felix Kling: No, I actually really meant array of objects... the "variantX" keys just seem to be a numeration, which arrays provide natively (kind of). But then again, there are multiple solutions for a problem :)
• Steve: But I'd read in many places "Don't store key-value pairs in Arrays" (in objects instead) - phabricator.com/docs/phabricator/article/…
• Felix Kling: @Steve: Well, not string keys, but numerical, consecutive keys (indexes) are fine. That's what makes an array an array.

Answer 2

Try this:

var variant1 = new Object();
variant1['a'] = 'apple';
variant1['b'] = 'orange';
variant1['c'] = 'pear';
var variant2 = new Object();
variant2['a'] = 'red';
variant2['b'] = 'green';
variant2['c'] = 'blue';
for (i=1; i<3; i++){
var thisvar ;
eval( 'thisvar = variant'+i);
 for(var newindex in thisvar) {
 var name = newindex;
 var contents = thisvar[newindex];
 alert(name+'='+contents);
 }
}

• user1726343: Please avoid the use of eval.

Answer 3

If you just want to inspect the object properties you can simply do

alert(JSON.stringify(container))