Loops in JavaScript

Loops in JavaScript

Loops in JavaScript are used when we need to execute the same block of code multiple times. Instead of writing the same statements repeatedly, we can use a loop to repeat the execution based on a condition or a collection of values. JavaScript provides different types of loops, and each one is useful in different situations.

The for loop is one of the most commonly used loops in JavaScript. It is generally used when we know how many times we want to execute a block of code. It contains three parts: initialization, condition, and increment or decrement.

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

Here, let i = 1 initializes the variable, i <= 5 is the condition that determines whether the loop should continue, and i++ increments the value after each iteration.

The while loop executes a block of code as long as the given condition is true. Unlike the for loop, the initialization and increment can be written separately.

let i = 1;

while (i <= 5) {
    console.log(i);
    i++;
}

The condition is checked before every iteration. If the condition is false from the beginning, the code inside the while loop will not execute even once.

The do...while loop is similar to the while loop, but there is one important difference. In a do...while loop, the code inside the loop executes first and the condition is checked afterward. Therefore, the code inside the loop will execute at least once, even if the condition is initially false.

let i = 1;

do {
    console.log(i);
    i++;
} while (i <= 5);

JavaScript also provides for...of, which is mainly used to iterate over the values of iterable objects such as arrays and strings. For example, if we have an array of fruits, for...of allows us to directly access each fruit.

let fruits = ["Apple", "Banana", "Mango"];

for (let fruit of fruits) {
    console.log(fruit);
}

In this case, the variable fruit contains "Apple", "Banana", and "Mango" during different iterations.

The for...in loop is mainly used to iterate over the properties or keys of an object. For example:

let user = {
    name: "John",
    age: 25,
    city: "Chennai"
};

for (let key in user) {
    console.log(key);
}

This prints the property names such as name, age, and city. If we want to access the corresponding values, we can use bracket notation with the key.

for (let key in user) {
    console.log(user[key]);
}

One important difference to remember is between for...in and for...of. for...in is used to iterate over keys or property names, while for...of is used to iterate over values. For example, when used with an array, for...in gives the indexes, whereas for...of gives the actual elements.

let fruits = ["Apple", "Banana", "Mango"];

for (let index in fruits) {
    console.log(index);
}

for (let fruit of fruits) {
    console.log(fruit);
}

So, the main loop types in JavaScript are for, while, do...while, for...of, and for...in. The choice of loop depends on what we are trying to achieve. A for loop is useful when the number of iterations is known, while is useful when repetition depends mainly on a condition, do...while is useful when the code must execute at least once, for...of is useful for iterating over values, and for...in is mainly useful for iterating over object properties.