Skip to main content

For Loop

A for loop is used to execute a block of code multiple times. It consists of three parts: initialization, condition, and increment/decrement. The for loop syntax is as follows:

for (initialization; condition; increment/decrement) {
  // Code block to be executed
}
  • The initialization part is executed only once at the beginning of the loop. It is used to initialize the loop variable.
  • The condition part is evaluated before each iteration. If the condition is true, the code block inside the loop is executed; otherwise, the loop terminates.
  • The increment/decrement part is executed after each iteration. It is used to update the loop variable.

Here is an example of using a for loop to print numbers from 1 to 5:

for-loop.js
for (let i = 1; i <= 5; i++) {
  console.log(i);
}

In the example above, the for loop initializes the loop variable i to 1. It checks if i is less than or equal to 5. If the condition is true, it executes the code block inside the loop and increments i by 1 after each iteration.

Concept of Loop​

A loop is a programming construct that repeats a block of code multiple times. It allows you to iterate over a sequence of values or perform a task until a certain condition is met. JavaScript provides several types of loops, including the for loop, while loop, and do...while loop.

An Iteration is a single execution of the loop body. In each iteration, the loop variable is updated according to the loop's increment/decrement expression. The loop continues to execute until the condition evaluates to false. If the condition is false from the beginning, the loop body will not execute at all. If the condition never evaluates to false, the loop will run indefinitely, causing an infinite loop.

The for loop is commonly used when you know the number of iterations in advance. It is more concise and readable than the while loop and is suitable for iterating over a range of values.

Nested For Loop​

You can nest for loops inside each other to create complex patterns or iterate over multi-dimensional arrays. When you nest loops, the inner loop is executed multiple times for each iteration of the outer loop.

Here is an example of using nested for loops to create a multiplication table:

multiplication-table.js
for (let i = 1; i <= 10; i++) {
  for (let j = 1; j <= 10; j++) {
    console.log(`${i} * ${j} = ${i * j}`);
  }
}

In the example above, the outer for loop iterates over the numbers from 1 to 10. For each iteration of the outer loop, the inner for loop iterates over the numbers from 1 to 10 and prints the multiplication table for the current number.

Infinite Loop​

An infinite loop is a loop that continues to execute indefinitely. It occurs when the loop condition never evaluates to false, causing the loop to run forever. Infinite loops can crash your program or browser tab, so it is essential to avoid them.

Here is an example of an infinite loop:

infinite-loop.js
for (let i = 1; i <= 5; i--) {
  console.log(i);
}

In the example above, the loop variable i is initialized to 1, and the loop condition i <= 5 is always true. The increment/decrement expression i-- decrements i by 1 after each iteration. Since i is always less than or equal to 5, the loop will run indefinitely.

To avoid infinite loops, make sure the loop condition eventually evaluates to false. You can use a counter variable to limit the number of iterations or add a break statement to exit the loop when a certain condition is met.

Examples​

Let's look at some examples to understand how the for loop works in JavaScript.

Example 1: Printing Numbers​

In this example, we will use a for loop to print numbers from 1 to 5.

print-numbers.js
for (let i = 1; i <= 5; i++) {
  console.log(i);
}

In the example above, the loop variable i is initialized to 1, and the loop condition i <= 5 checks if i is less than or equal to 5. If the condition is true, the loop body prints the value of i and increments i by 1. The loop continues to execute until i is greater than 5.

Example 2: Sum of Numbers​

In this example, we will use a for loop to calculate the sum of numbers from 1 to 5.

sum-numbers.js
let sum = 0;
for (let i = 1; i <= 5; i++) {
  sum += i;
}
console.log(`Sum of numbers from 1 to 5: ${sum}`);

In the example above, the loop variable i is initialized to 1, and the loop condition i <= 5 checks if i is less than or equal to 5. The loop body adds the value of i to the sum variable in each iteration. After the loop completes, the sum of numbers from 1 to 5 is printed to the console.

Congratulations! 🎉 You now know how to use the for loop in JavaScript to execute a block of code multiple times based on a specified condition 🚀

In the next section, we will learn about the while loop in JavaScript. Let's keep going! 🚀

Made with ❤️ by Fasakin Henry