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 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>Result
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>Result
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>Result
JavaScript Loop syntax are very similar in others language too, take a look at loop in other languages