Javascript: confused about how nested for loops work

Question

Why do nested for loops work in the way that they do in the following example:

var times = [
            ["04/11/10", "86kg"], 
            ["05/12/11", "90kg"],
            ["06/12/11", "89kg"]
];

for (var i = 0; i < times.length; i++) {
        var newTimes = [];
        for(var x = 0; x < times[i].length; x++) {
            newTimes.push(times[i][x]);
            console.log(newTimes);  


        }

    }

In this example I would have thought console.log would give me the following output:

["04/11/10"]
["86kg"]
["05/12/11"]
["90kg"]
["06/12/11"]
["89kg"]

However, I actually get this:

["04/11/10"]
["04/11/10", "86kg"]
["05/12/11"]
["05/12/11", "90kg"]
["06/12/11"]
["06/12/11", "89kg"]

Is anyone able to help me understand this?

EDIT:

Thanks for all your responses!

Solution 1

You are redefining newTimes on every single loop and you are outputting to the console on each column push.

var times = [
            ["04/11/10", "86kg"], 
            ["05/12/11", "90kg"],
            ["06/12/11", "89kg"]
];
 var newTimes = [];
for (var i = 0; i < times.length; i++) {     
        for(var x = 0; x < times[i].length; x++) {
            newTimes.push(times[i][x]);
        }
    }
    console.log(newTimes);  

Returns: ["04/11/10", "86kg", "05/12/11", "90kg", "06/12/11", "89kg"] http://jsfiddle.net/niklasvh/SuEdt/

Solution 2

// remember that the increment of the counter variable
// is always executed after each run of a loop


for (var i = 0; i < n; i++) {
    // some statement(s) to do something.. 

        // initializes child-loop counter in the first run of the parent-loop
        // resets child-loop counter in all following runs of the parent-loop
        // while i is greater than 0 and lower than n

    for (var j = 0; j < p; j++) {
        // some statement(s) to do something..

            // initializes grandchild-loop counter in the first run of the child-loop
            // resets grandchild-loop counter in all following runs of the child-loop
            // while j is greater than 0 and lower than p

        for (var k = 0; k < q; k++) {
            // some statement(s) to do something..
            // or add more internal loop-nestings if you like..
        }
    }
}

// if the counter variables of the descendent-loops were set before the loop-nesting,
// the inner loops would only run once, because the counter would keep the value
// of the abortion condition after the loop is finished

Solution 3

You output would be appropriate if the log statement would read

console.log(times[i][x]);

Instead you output your complete new list newTimes which is initialized outside the inner loop and grows with each inner loop iteration.

Solution 4

The problem is in the second round of the inner loop, where it pushes the second element into newTimes. Anyway I don't understand the reason of inner loop. You can write much simpler:

var times = [
            ["04/11/10", "86kg"], 
            ["05/12/11", "90kg"],
            ["06/12/11", "89kg"]
];

for (var i = 0; i < times.length; i++) {
    console.log(time[i][0]);  
    console.log(time[i][1]);   
}

Solution 5

Do this:

var newTimes = [];
for (var i = 0; i < times.length; i++) {
        for(var x = 0; x < times[i].length; x++) {
            newTimes.push(times[i][x]);
            console.log(newTimes);  


        }

    }

You are re-initializing newTimes each time through the loop.

View more solutions