5.03 Computer Science

For Loops

While loops are useful when you don't know how many times a loop needs to execute. However, when you do have this information, you can use a different kind of loop…a for loop.  

For example, imagine you have three dirty glasses in your sink that you need to load into the dishwasher. Because there is a finite number of glasses, you know you need to repeat the process of rinsing and placing the glass on the rack three times. Programs work in a similar way using the for loop.  

Suppose you are writing a guess-the-number game and you want to limit the number of guesses to four. A for loop would be a good choice because you know exactly how many times you want to allow your player to make a guess.  

The for loop has three statements. Each statement is separated by a semicolon ;. Let's take a look at the for loop's syntax.

  1. for (counter; condition; increment)

  2.   {

  3.     block of code

  4.   }

Code

Explanation

for 

Starts the for loop

counter

Used to set the value of a counter variable. 
This variable is only evaluated once at the start of the loop. 
It is the value the loop will start counting from. Typically, this value is 0.

;

The semicolon ends the statement just like you do with other statements in JavaScript.

condition 

Used to evaluate if the loop should continue to execute. 
If this condition returns
true, the loop will continue; if it returns false, it will stop. 
The condition is evaluated in every iteration of the loop until it is
false.

;

Semicolon

increment

Used to update the value of the counter variable. This is how the loop keeps track of how many times it has executed. Every time the loop runs it adds one, or increments, the counter variable.

Review how a for loop would work in the guess-the-number game's code below.

  1. let secretNumber = 25;

  2. let guess;

  3.  

  4. for(let i = 0; i < 4; i++)

  5.   {

  6.     guess = Number(prompt("Please guess a number between 1 and 100: "));

  7.     if (guess == secretNumber)

  8.       {

  9.         console.log("Congratulations you guessed the number!");

  10.         console.log();

  11.         break;

  12.       }

  13.     else

  14.       {

  15.         console.log("Sorry, you didn't guess the correct number.");

  16.         console.log();

  17.       }

  18.   }

Output

Please guess a number between 1 and 100: > 65
Sorry, you didn't guess the correct number.

Please guess a number between 1 and 100: > 41
Sorry, you didn't guess the correct number.

Please guess a number between 1 and 100: > 3
Sorry, you didn't guess the correct number.

Please guess a number between 1 and 100: > 25
Congratulations you guessed the number!

Line Number

Explanation

4

Let's break down the statements for the for loop on line 4: for(let i = 0; i < 4; i++)

Part 1

let i = 0;
This statement declares and assigns the variable
i the value 0. 
The variable
i is the counter variable and will increase each time the loop is executed. The statement ends with a semicolon.

Part 2

i < 4;
This statement is the conditional statement that determines how many iterations the loop will execute. 
In each iteration, the code tests if 
i < 4 is true. 
Since the counter starts at 0,
i < 4 will be true when i has values 0, 1, 2, or 3.

Part 3

i++
This statement increments the counter variable
i by 1 using the increment operator  ++
Each time the loop executes, it will add 1 to
i
The increment operator
++ is a shorter way of writing i = i + 1.

This for loop executes up to four times while the user tries to guess the secret number. Each guess is compared to the secretNumber variable. 

If guess equals secretNumber, then the code outputs a message to the player, letting them know they guessed correctly. Otherwise, the code outputs a message that the user didn't guess the correct number.