How to loop through Nested Json Array with (JavaScript) for loop and display the text

Question

This may be a fairly simple question but it's just not working for me no matter how many times I change the for loop around. So how would you loop through this array using a for loop in JavaScript?

var fielditems =[
     [["News Tips"],["Opinions"],["MedMinutes"]],
     [["Yes"],["No"],["Maybe"]],
     [["How"],["Why"],["When"]]
];

This is what I have and it's not working. I used an alert to just test out the result but it's not even returning anything.

for(itemSet in fielditems){
    var itemSetValues = fielditems[itemSet];
    for(set in itemSetValues){
        var itemValue = itemSetValues[set];
        for(value in itemvalue){
            alert(itemValue[value]);
        }
    }
}

What am I doing wrong?

Answer 1

Don't use for() with in for arrays. It's for object properties. Use the standard format instead.

Demo: http://jsfiddle.net/ThinkingStiff/EVWch/

Script:

var fielditems =[
        [["News Tips"],["Opinions"],["MedMinutes"]],
        [["Yes"],["No"],["Maybe"]],
        [["How"],["Why"],["When"]]
    ];

for( var itemIndex = 0; itemIndex < fielditems.length; itemIndex++ ){
    var itemSetValues = fielditems[itemIndex];
    for(var setIndex = 0; setIndex < itemSetValues.length; setIndex++ ){
        var itemValue = itemSetValues[setIndex];
        for(var valueIndex = 0; valueIndex < itemValue.length; valueIndex++ ){
            alert(itemValue[valueIndex]);
        };
    };
};

​

Answer 2

Firstly, console is your friend. You get error ReferenceError: itemvalue is not defined because javascript is case sensitive. Change itemvalue in the most nested loop to itemValue.

Secondly, if you want iterate thorugh an array, you should use for-loop instead for-in-loop

Answer 3

• Don't use for-in loops on arrays
• Don't use (running) variables without declaring them as local

for (var i=0; i<fielditems.length; i++) {
    var itemSetValues = fielditems[i];
    for (var j=0; j<itemSetValues.length; j++) {
        var itemvalue = itemSetValues[j]; // notice the case
        for (var k=0; k<itemvalue.length; k++) {
            alert(itemvalue[k]);
        }
    }
}

Answer 4

for..in is for objects ({}), not for arrays ([]).

You need to use a standard for loop.

for(var i = 0, iLen = fielditems.length; i < iLen; i++){
    var iItem = fielditems[i];
    for(var j = 0, jLen = iItem.length; j < jLen; j++){
        var jItem = iItem[j];
        alert(jItem[0]); // you can also add another loop here, if this will have more elements
    }
}

NOTE:

for(var i = 0, iLen = fielditems.length; i < iLen; i++)

is better than:

for(var i = 0; i < fielditems.length; i++)

because fielditems.length isn't requested each loop, just once at the start.