Can someone explain the FOR loop below?

I understand, IF(condition is true execute following code block) {following code block}

But I don’t get what is going on with FOR loops… disclaimer, first time learning them properly so please explain it in a way a 5 year old child would understand.

var fruits, text, fLen, i;
fruits = ["Banana", "Orange", "Apple", "Mango"];
fLen = fruits.length;

text = "<ul>";
for (i = 0; i < fLen; i++) {
  text += "<li>" + fruits[i] + "</li>";
}
text += "</ul>";

Hi @ayanda
Please try reading the Looping code article.
If you have more questions after reading it feel free to ask.
Thanks,

I haven’t seen that article before, thanks. Let me check ir out and see if I get it.

@Rafael_Green hey, so if I’m understanding correctly,

if (food >= foodNeeded)

the code above is only considered false in the 10th loop in relation to the counter below?

loop(food = 0; foodNeeded = 10)

under normal circumstances, the code below would be true if food was 10 right?

if (food >= foodNeeded)

Full code example from the article is below:

loop(food = 0; foodNeeded = 10) {
  if (food >= foodNeeded) {
    exit loop;
    // We have enough food; let's go home
  } else {
    food += 2; // Spend an hour collecting 2 more food
    // loop will then run again
  }
}

no, notice that in each iteration we increase food by 2 and not by 1.
so in the first condition evaluation the food’s value is 0, in the second it’s 2, etc…

Oh yeah… meant to say 5th loop not 10th.

So that code is only considered false in the 5th loop in relation to the counter one?

actually, the condition food >= foodNeeded is evaluated to true in the 6th iteration

Ok so i fixed the post above… 6th loop. Is it that the case?

Hello @ayanda

let me explain the steps on how the for loop work

  1. the initialization code start (i=0) you can put any code in that part or even make it empty

  2. the test code (i<flen) which can be empty also or you put any code there and you put the test in the for {} code block and use break;

  3. the block code ( text += "<li>" + fruits[i] + "</li>"; ) which also can be empty but that would be meaningless

  4. the incremenet code (i++) which also can be empty or you put any code here

  5. we go back to step 2 then repeat the steps after it

when i say it can be empty that mean the for can be for (;;) {} or for (i = 0; i < fLen;) { text += "<li>" + fruits[i] + "</li>";
i++
}

in the above code i put the increment part in the block but the recommened that you use each part as it should be unless you have good cause to do other thing

i just tried to explain what is valid and what is not despite it has meaning or not

hope that explain it and help and have a nice day

Hi @justsomeone, i wasnt specifically interested on the formation and arrangement of the FOR loop, I’d wanted to understand why it does what it does in the formation I was given as an example.

I understand IF (condition that is true or not)
{Code block to run if its true}
Else {code block to run if its false}

When it comes to FOR loop, explaining and understanding it this way is whats tripping me up.

I hope i have conveyed my issue clearly. Also, going up and down articles just ends up confusing me, hence i’m not getting how Rachel make me understand, unfortunately.

  1. first i will be = 0
  2. then that for loop test is i < fLen the answer is yes true
  3. then the body of the for excuted the text = and so on
  4. i++ excuted so i now = 1
  5. for loop will ask does i < flen the answer is yes true
  6. then the body of the for excuted the text = and so on
  7. i++ excuted so i now = 2
    and so on till we get to i become 4
  8. for loop will ask does i < flen the answer is no false
  9. the for loop ended and the first statment after the for loop excuted if there is any

so for loop keep working as long as the condition part is true once it false it will stop

hope that help and have a nice day

oh, for number 9 you meant the first statement being i=0 right? Thats the first statement that ended along with the for loop.

I get it now. Sorry for needing you to dumb it down for me, I have learning disabilities and tend to only understand complex things only after they are broken down and simple.

My brain just shuts down when I’m overwhelmed with technical and complex stuff.

It’s taking me forever to learn javascript.

yes first i = 0

i see you doing great we all take time when we get to new thing and never think in that way
everyone will get it including you it just time difference somtime i get things in shorter time than other sometime in the same time and other time for long time compared to other

you will get it and never give up and you allways welcome and have a nice day