Iterate Through an Array with a For Loop - Confused by what is happening

Tell us what’s happening:
I’ve completed the challenge, however, this was achieved simply by mimicking the example that is already there. I don’t really understand exactly what is happening here, or why it equals 20.

  1. So, ‘total’ initially equals 0

  2. In the setup of the loop, ‘x’ also starts at 0

  3. If ‘x’ is less than the length of the array, then increase ‘x’ by 1

So, the length of the array is 5, as that is how many elements are contained within it (unless I’m totally misunderstanding this). This is where it all becomes unclear to me.

My understanding of the section in bracelets is that it will take the value of ‘x’ as the index of the array, then add the value of that index to ‘total’.

So, the way I see the first time round the loop is;

  • ‘x’ starts as 0

  • The array length is 5, and ‘x’ is 0, so increase ‘x’ by 1

Then we go into the bracelets.

  • myArr[x] should resolve to index 1 of the array, which is 3, which then gets added to the variable of ‘total’.

If the above were to play out, then surely the value of ‘x’ would be equal to 5 long before the value of ‘total’ reached 20. Obviously my understanding is off somewhere, but I don’t quite see where.

Your code so far


// Example
var ourArr = [ 9, 10, 11, 12];
var ourTotal = 0;

for (var i = 0; i < ourArr.length; i++) {
  ourTotal += ourArr[i];
}

// Setup
var myArr = [ 2, 3, 4, 5, 6];

// Only change code below this line
var total = 0;
for (var x = 0; x < myArr.length; x++) {
  total += myArr[x];
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:67.0) Gecko/20100101 Firefox/67.0.

Link to the challenge:
https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop

I think I’ve just figured it out. I had this round the wrong way, because it runs whats within the bracelets first, so we now have this:

total += myArr[x] would actually be 2, as ‘x’ initially equals 0. It then runs the loop again, but ‘x’ has now been increased by 1. This means the next index to be added is index 1, which would equate to 3 in the array. This means total now equals 5, (2+3). This then proceeds until each number in the array has been added to the value of ‘total’, which will eventually reach 20.

for ( /* (starting value) */ ; /* (condition) */ ; /* (update variable) */ ) { 
     /* (body) */
}

the sequence is this:

  1. first the starting value is executed;
  2. the condition is checked - if true go to step 3, if false end loop
  3. the body ia executed
  4. then update variable is executed, and the loop returns at step 2

So the variable is updated after the body has been executed?

yes, the variable is updated after the body of the for loop is executed

1 Like

Using @ilenia’s helpful snippet:

for ( /* (starting value) */ ; /* (condition) */ ; /* (update variable) */ ) {
    /* (body) */ 
}

starting value - This is code that is executed only once, before the first iteration of the loop.
condition - This is checked before each loop iteration. If it is truthy, then the loop is done.
update variable - This is code that is executed after each loop iteration.
body - This code is executed in each loop iteration.