How to write loops in JavaScript

In programming, loops are used to repeat a block of code. They are a fundamental concept in JavaScript and many other programming languages to make your programs more efficient.

There are three types of loops in JavaScript:

• for loops
• while loops
• do...while loops

Let's take a look at each type of loop, how to use them and when to use them.

For Loops

For loops are the most basic type of loop in JavaScript. They are used to repeat a block of code a specific number of times.

The syntax for a for loops is as follows:

1for (let i = 0; i < 10; i++) {
2  console.log(i);
3
4      // This will be console logged 10 times
5}

Let's break down the syntax:

• let i = 0: This is the initialization of the loop. It sets the variable i to 0. This is the starting point of the loop.
• i < 10: This is the condition that the loop will continue to run as long as it is true.
• i++: This is the increment statement. It increments the variable i by 1 each time the loop runs. If we didn't have this, the loop would run forever.

While Loops

While loops are used to repeat a block of code while a condition is true.

They differ from for loops in that they don't require an initialization statement, and will continue to run as long as the condition is true.

The syntax for a while loop is as follows:

1let i = 0;
2while (i < 10) {
3  console.log(i);
4  i++;
5}

Let's break down the syntax:

• let i = 0;: This is the initialization of the loop. It sets the variable i to 0. This is the starting point of the loop.
• while (i < 10) {: This is the condition that the loop will continue to run as long as it is true.
• i++;: This is the increment statement. It increments the variable i by 1 each time the loop runs.

Do...While Loops

Do...while loops are similar to while loops, but they will always run at least once. This is because the condition is checked after the loop has run.

The syntax for a do...while loop is as follows:

1let i = 0;
2do {
3  console.log(i);
4  i++;
5} while (i < 10);

Let's break down the syntax:

• do {: This is the starting point of the loop.
• console.log(i);: This is the code that will be executed each time the loop runs.
• i++;: This is the increment statement. It increments the variable i by 1 each time the loop runs.
• } while (i < 10);: This is the condition that the loop will continue to run as long as it is true.

Nested Loops

Nested loops are loops that contain another loop. This allows you to repeat a block of code multiple times.

The syntax for a nested loop is as follows:

1for (let i = 0; i < 10; i++) {
2  for (let j = 0; j < 10; j++) {
3      console.log(i, j);
4  }
5}

When writing nested loops, it is important to use different variables for the loops. If we used the same variable, the inner loop would overwrite the outer loop's variable.

Nested loops can also become quite complex, so you must ensure that the loops are written correctly.

When to use each type of loop

• Use a for loop when you know exactly how many times you want to repeat the code.
• Use a while loop when you don't know how many times you want to repeat the code, but you know the condition.
• Use a do...while loop when you want to repeat the code at least once, but you don't know how many times you want to repeat the code.

The most common type of loop

The most common type of loop is the for loop. It is used when you know exactly how many times you want to repeat the code.

Useful resources

• MDN Web Docs - Loops and iteration
• W3Schools - JavaScript Loops

Looking to learn more about loops in JavaScript?

You’ve learned the basics of for, while, and do...while loops—now it’s time to put your skills to the test!