Can someone help me understand the logic of nesting for loops

Before I begin this exercise I really want to know the logic and how things work in the example:

var arr = [
  [1,2], [3,4], [5,6]
];
for (var i=0; i < arr.length; i++) {
  for (var j=0; j < arr[i].length; j++) {
    console.log(arr[i][j]);
  }
}

Assuming you’re clear on how a for loop that is not nested works

var arr = [ [1,2], [3,4], [5,6] ]

Let’s just loop through that with a plain un-nested for loop

i = 0   arr[0] = [1,2]
i = 1   arr[1] = [3,4]
i = 2   arr[2] = [5,6]

OK, with nesting

arr is an array. Lets loop through that.

i = 0   arr[0] = [1,2]  outer

   Hey! arr[0] is an array too. Lets loop through that too while we're here - inner
      j = 0   arr[0][0] = 1 
      j = 1   arr[0][1] = 2

i = 1   arr[1] = [3,4]  outer

   Hey! arr[1] is an array too. Lets loop through that too - inner
      j = 0   arr[1][0] = 3
      j = 1   arr[1][1] = 4

i = 2   arr[2] = [5,6]  outer

   Hey! arr[2] is an array too. Lets loop through that too - inner
      j = 0   arr[2][0] = 5
      j = 1   arr[2][1] = 6
3 Likes