Search code examples
javascriptfor-loopnested-for-loopcode-visualization

How does this specific nested for loop work in vanilla JavaScript?


I got a quiz question in my Full Stack Web Development online course that states the following:

let sum = 0;
for (let i = 0; i < 5; i++) {
    for (let j = 0; j < 2; j++) {
        sum = sum + i + j;
        continue;
    }
}
console.log(sum);

Now, the correct answer to the question is 25 according to the answer of the quiz, but I have no idea how it gets to 25? The closest I get when writing it out on paper to try and visualize it, is either 15 / 16.

Could someone please write a visualization that would make it clearer for me on how this nested loop gets to 25?

Thanks in advance.


Solution

  • Add a console after second for, you should see the visualization

    let sum = 0;
    for (let i = 0; i < 5; i++) {
        for (let j = 0; j < 2; j++) {
            console.log(`sum=${sum} i=${i} j=${j}`)
            sum = sum + i + j;
            continue;
        }
    }
    console.log(sum);
    
    //output
    // sum=0 i=0 j=0
    // sum=0 i=0 j=1 
    // sum=1 i=1 j=0 
    // sum=2 i=1 j=1 
    // sum=4 i=2 j=0 
    // sum=6 i=2 j=1 
    // sum=9 i=3 j=0 
    // sum=12 i=3 j=1
    // sum=16 i=4 j=0
    // sum=20 i=4 j=1
    // 25