While Loops

While loops are similar to for loops in that they loop over a piece of code. The only difference is that a for loop continues until a condition is met and a while loop continues while a condition is met.

Quick sideline in this lesson. When we write boolean = true we can also just write boolean.

Simple while loop example:

var soloLoop = function() {
  loops = true;
   while ( loops != false ) {
    console.log("Looped once!");
    loops = false;
   }
};

soloLoop();
  • Set the conditional outside the loop : loops = true;
  • Set the condition in brackets after while, just like the for loop : while (loops != false).
    • This condition says to continue looping as long as our variable soloLoop is not false.
    • We could also write it as while ( loops ), as explained in the sideline above.
  • Set the endpoint, in this case a simple loops = false;, but it could have been some math like loops++ or a more complex function. Let's say the condition was while ( loops < 100 ); we could set the conditional at 1 and the code that changes the conditional's value as loops = loops + 10; then the while loop would loop 10 times as in the below example.
  • soloLoop() just tells the code to run the soloLoop function without input.

    var soloLoop = function(){ loops = 1; while ( loops < 100 ) { console.log("Looped once!"); loops = loops + 10; } };

    soloLoop();

Why for why while?

For loops have a predictable end point, so we use them when we need one. While loops on the other hand are used when we don't know when the loop should end. The one uses a specific end point, the other a condition for ending the loop. In the last example, though, we created a while loop that acts like a for loop.

Do/while

It's possible for a while loop to immediately meet its end condition and never run. There's a solution to this called do. Here's what do does:

var myDoLoop = function(){
  var myCondition = 0;
  do {
      console.log("This is my string, and my condition is " + myCondition);
  }
  while (myCondition);
};

myDoLoop();

What's happening?

  • First we set the condition variable to 0 (or false);
  • Then we create our do loop that prints out a string.
  • Then we set the while condition to true.

If this was a regular while loop it would just do nothing, because myCondition = false, and the condition for running the loop is that my Condition = true. I wanted to test this to see if that's really the case, so I changed the code above a little. Here's what I did:

var myDoLoop = function(){
    var myCondition = 0;
    do {
        console.log("This is my string, and my condition is " + myCondition);
        myCondition = myCondition++;
    }
    while (myCondition);
};

myDoLoop();

That failed miserably - ∞ loop. I don't think I understand how to affect the condition in the case of "do" loop. I'll experiment some more. (In retrospect I was adding 1 on each loop taking myCondition further and further away from 0/false.)

Okay, next example fixed that, the conditional is change in the while (myCondition). Instead of adding myCondition = myCondition++; to the do I should have change while (myCondition) to while (myCondition++). Or so I think.

For a While I'll Do something... Good grief!

Changing the do loop conditional still makes no sense to me. Here's what I did in the final example, I'll examine that to determine exactly how this all fits together...

Okay, while, no pun intended, I was saving this page I took a look at do/while loops again. I missed an essential part. Do/while loops will run once and then continue running "while the condition" is true. All that means is the value of myCondition (in the above example) must be !=0 or !=false for it to continue running. If we start with myCondition = true that's the same as myCondition = 1. When the while condition is while(myCondition-) it should run once and the myCondition = 0 so it stops. So in the below example we start with var myThirdLoop = 25; and run the while as while (myThirdLoop--) forcing it to loop 25 times until var myThirdLoop = 0 (false). Seems pretty logical.

var myFirstLoop = 100;
var mySecondLoop = 50;
var myThirdLoop = 25;

for (myFirstLoop; myFirstLoop > 0; myFirstLoop--) {
    console.log("My first loop is a FOR loop. It's counting down -- " + myFirstLoop);
}

while (mySecondLoop > -50) {
    console.log("My second loop will run while " + mySecondLoop + " is larger than -50");
    mySecondLoop--;
}

do {
    console.log("My third loop is currently on " + myThirdLoop + "and counting down to 0");
}
while(myThirdLoop--);