Loops in Javascript

Learn how to write loops in JavaScript, loop is very useful when you want to perform same task repeatedly with different parameter for any collection, in JavaScript we can loop through array or any dictionary object.

for (condition)
{
    statement;
}

When you need same set of code to be executed repeatedly with some different values, then Loop is the perfect solution. Here we see different type of Loop in JavaScript example

You will be learning following points:

• JavaScript For Loop Example
• javascript loop through array
• Array methods for iteration
• JavaScript Do While Loop Example
• JavaScript While Loop Example

JavaScript for loop is the most frequently used loop, we run the loop till specified condition is satisfied, this is how to write for loop in javascript.

for ([start]; [condition]; [final-expression])
        statement

<script>
for (i = 0; i <= 5; i++)
{
    document.write("Javascript for loop : value of i " + i + " <br>");
}
</script>

This will print the value of i every time, so you can write your code block inside the loop that you want to be executed again and again until the condition is satisfied (here in example : i <= 10)

here is an example of javascript loop through array of objects

var arr = ["red", "blue", "color", "Green", "orange"];
for (var i = 0; i < arr.length; i++) {
        document.writeln(arr[i]);
        document.writeln("<br>");
    }

Result:

javascript for loop break example with conditional logic

in following example I am checking if the value is "color" then break the loop.

var arr = ["red", "blue", "color", "Green", "orange"];
for (var i = 0; i < arr.length; i++) {
    document.writeln(arr[i]);
    if (arr[i] == "color")
        break;
}

Result:

Iterate over the elements in an array
Note: JavaScript forEach loop does not support break; you can use every() method instead

var arrColor = ["red", "blue", "color", "Green", "orange"];
arrColor.forEach(function (elem) {
    document.writeln(elem);
});

In above example, I have used document.write, instead of that you can assign the value in a variable, like var p1=elem;.

Result:

Iterate using every method

arr.every(callback(element[, index[, array]])[, thisArg])

Here is an example of how to use javascript every() method to iterate through an array.

var arrColor = ["red", "blue", "color", "Green", "orange"];
arrColor.every(function (elem) {
    document.writeln(elem);
     return true; // must;
});

Result:

In above example if you want to add a condition to break , use the code below

     if (elem.length === 0) {
                return false; // break
            }

Do Loop will execute first and While condition is satisfied it will exit.

<script>
var i = 0;
do {
document.write("Javascript do while loop: value of i " + i + "<br/>");
i++;
}
while (i <= 5);
</script>

While loop will continue until condition is satisfied, in following example loop will continue until (i < 5).

<script>
var i = 0;
while (i < 5) {
        document.write("Javascript While loop: value of i  " + i + "<br/>");
    i++;
    }
</script>

JavaScript Loop syntax are very similar in others language too, take a look at loop in other languages

• Loop in C#
• Loop in PHP
• Loop in Python