# Submodule 7.2: Loops

 Site: ΕΛ/ΛΑΚ Moodle Course: Study / Web Design and Web Development Book: Submodule 7.2: Loops
 Printed by: Guest user Date: Saturday, 12 June 2021, 9:38 PM

• for loop
• while loop

## for loop

For loops are the most common looping in JavaScript. Typically, we use it when we know the number of iterations we need: a fixed number (count to ten) or the length of a data structure.

The for loop has the following syntax:

for (initial expression; test to run; increment) {    code block to be executed}
##### Example 1
/*let's count from 1 to 5*/for (var index = 1; index <= 5; index++){ console.log(index); }

In this example, we set our three expressions in the for loop.

• the initial expression: this is executed once before the loop runs, and typically sets the initial condition for the counter: in this case, setting index equal to 1
• the test to run before each iteration over the loop: if this evaluates to true, the loop will continue
• executed after each iteration through the loop. In this case, we use it to increment index to the next value.

Tip: Copy the above piece of code and paste it directly into the console, to see how it works.

##### Example 2

In this example, we create an array of colors and use the loop to iterate over the array and output its contents to the console.

/* remember that arrays start at zeroso we will loop from 0 to the length of the array*/var color = ["red", "green", "blue"];for (var i = 0; i < color.length; i++){  console.log(color[i]);}

Tip: Copy the above piece of code and paste it directly into the console, to see how it works.

Exercise

Loop through the integers from 1 to 100 and write each to the console only if it is odd (check if the remainder - % - after the division of the integer by 2, is 1). Work directly in your console.

for(var j = 0; j < 100; j++ ){  if (j % 2 == 1){       console.log(j)  };};

## while loop

We use while loops when we don’t know how many times we want it to run.

The while loop has the following syntax:

while (condition) { code block to be executed}

The while loop, loops through a block of code as long as a specified condition is true.

##### Example 1
/* add consectuive integers until we get to 100*/var i = 0, sum = 0;while(sum <= 100){    /*here we increment i, then add it to sum*/    i = i + 1;     sum = sum + i;}/*the loop exits when sum reaches or exceeds 100*/console.log("We added up to "+i+" to get to 100");

This example uses a while loop to add consecutive integers until the sum equals or exceeds 100. The while condition tests if this is true, and at each loop it increments i and adds it to sum. The while loop works well here since we don't know how many times the loop will have to run.

Tip: Copy the above piece of code and paste it directly into the console, to see how it works.

In this spreadsheet, you can see the values of the variables

var j = 0;var sum = 0;while (sum < 1000) {  j = j + 1;  if (j % 2 == 1){       sum = sum + j;  };};console.log(j)