best way to loop through this array structure

Question

i have an array returned from an API that is structured like this:

{
    user:[
        {key1:[
            {sub_key1:value1},
            {sub_key2:value2}
            ]
        },
        {key2:[
            {sub_key1:value1},
            {sub_key2:value2}
            ]
        },
    ]
}

I need to loop through and do something with every 'value'.

at the moment I have:

$.each(user, function(key,value){
    $.each(value, function(i, val){
        //inside each key:value pair, nice
        //but how do i get the value of this pair, without knowing the key?

    });

});

with a for loop, looping over all the attributes of the value, see: http://stackoverflow.com/questions/8312459/iterate-through-object-properties — Hacketo, Jan 05 '15 at 13:15

score 0 · Answer 1 · answered Jan 05 '15 at 13:18

0

Iterate with a for loop:

for(var key1 in user)
    for(var key2 in user[key1])
        alert("key: " + key2 + " value: " + user[key1][key2]);

answered Jan 05 '15 at 13:18

Joanvo

5,677
2
25
35

[Why is using “for…in” with array iteration such a bad idea?](http://stackoverflow.com/questions/500504/why-is-using-for-in-with-array-iteration-such-a-bad-idea) – Ben Fortune Jan 05 '15 at 13:22
That does not apply to this case, because that question talks about arrays explicitly – Joanvo Jan 05 '15 at 13:23

score 0 · Answer 2 · answered Jan 05 '15 at 13:24

This will loop over ever possible value in your given data structure:

var obj = {
  user: [{
    key1: [{
      sub_key1: 'value1'
    }, {
      sub_key2: 'value2'
    }]
  }, {
    key2: [{
      sub_key1: 'value1'
    }, {
      sub_key2: 'value2'
    }]
  }, ]
};

Object.keys(obj).forEach(function (key) {
  obj[key].forEach(function (userItem) {
    Object.keys(userItem).forEach(function (numberedKey) {
      userItem[numberedKey].forEach(function (numberedKeyItem) {
        Object.keys(numberedKeyItem).forEach(function (subKey) {
          console.log(numberedKeyItem[subKey]);
        });
      });
    });
  });
});

score 0 · Answer 3 · answered Jan 05 '15 at 13:25

Try the following:

Object.keys(user).forEach(function (key) {
    user[key].forEach(function (subKey) {
        Object.keys(subKey).forEach(function (subKeyName) {
            console.log(subKeyName + ':' + subKey[subKeyName]);
        }); 
    });
});

neuro_sys · Answer 4 · 2015-01-05T14:42:17.700

This will work for any given arbitrary Object or primitive type. This is a typical case for using a recursive traversing and the built-in type operator of JavaScript. It passes down the type, key hierarchy, and value.

function recursiveCallFn(nameStack, value, fn) {
    var type = typeof value;

    if (type === 'string' || type === 'number' || type === 'boolean') {
        fn(type, value, nameStack);
    }

    if (type === 'object') {
        Object.keys(value).forEach(function (key) {
            nameStack.push(key);
            recursiveCallFn(nameStack, value[key], fn);
            nameStack.pop(key);
        });
    }
}

fn callback should be of the following prototype:

function (type, value, nameStack) {}

and call it as:

recursiveCallFn([], data, function (type, value, nameStack) {
    // do something...
});

Here's a working JSFiddle example.

For your example data, the output is:

string user[0].key1[0].sub_key1 value1
string user[0].key1[1].sub_key2 value2
string user[1].key2[0].sub_key1 value1
string user[1].key2[1].sub_key2 value2

best way to loop through this array structure

4 Answers4