Question

I’m trying to write a generic function that works with JSON arrays containing arbitrary attributes. Given the following:

var propMap = '{"ddColor": "Color","ddSize": "Size", "ddOther": "Other"}'

How can I iterate through the attributes and their values without specifying either? In other words, I want to iterate the elements without specifying “ddColor”, “ddSize” or “ddOther”. Yet, I want to iterate both the name and its value.

I’ve looked all over for a solution, but can’t find one and also can’t make it work on jsFiddle:

var propMap = '{"ddColor": "Color","ddSize": "Size"}'

for(var x in propMap) {
    // Key: x
    // Value: propMap[x]
    alert(x + ': ' + propMap[x]);
}

When I run the above code it seems to iterate character by character. Example:

1: C
2: o
3: l
4: o
5: r

Answer 1

Just use a for in loop:

for (var x in propMap) {
    if (propMap.hasOwnProperty(x)) {
        // Key: x
        // Value: propMap[x]
    }
}

And if that’s actually a string, you’ll need to parse the JSON first, of course:

propMap = jQuery.parseJSON(propMap);

Here’s a jsFiddle, too.