JavaScript loops; Through this tutorial, i am going to show you about javaScript loops and type of loops in javaScript with usage.
Loops are used to perform repeated tasks based on a condition. Conditions typically return true or false when analysed. A loop will continue running until the defined condition returns false.
In other words, loops are used to the execution of a block of code repeatedly until the specified condition is met true.
For example, suppose you want to print “My First Program” 5 times. This can be done in two ways, the first one is iterating a loop and the second one is printing manually.
Using a loop print “My First Program” ; as shown below:
<script>
for(var i=1; i<=5; i++) {
document.write( "My first Program - " + i + "<br>");
}
</script>
Print “My First Program” Manually; as shown below:
<script>
document.write( "My first Program" + "<br>");
document.write( "My first Program" + "<br>");
document.write( "My first Program" + "<br>");
document.write( "My first Program" + "<br>");
document.write( "My first Program" + "<br>");
</script>
You looked at both the examples given. How did i display my first program in JavaScript 5 times?. But in one i had to write the code repeatedly in a program. That is when i used for loop, then i write less code to print 5 times “my first program”.
Types of Loops in JavaScript
See the following javaScript loops with example:
- while loop
- do-while loop
- for loop
- for-of loop
- for-in loop
1: while Loop
The while loop is also known as an entry control loop. while loop is repeated block of code until specified condition met is true. If the condition fails, the loop execution halt.
Syntax of while loop:
while(condition) {
// Code to be executed
}
The “while loop” is executed block of code until the specified condition is met true. Inside the while loop, you should include the statement that will end the loop at some point in time. Otherwise, your loop will never end or run infinitely.
Example 1: while loop
<script>
var i = 25;
while (i<=20) {
document.write(i + "<br/>");
i++;
}
</script>
2: do while Loop
The do while loop is different from while loop. In the do-while loop, the specified condition is evaluated at the end of the loop. Even if the condition is false, the do-while loop will execute the block of code once.
Note:- Do while loop is also known as an exit control loop.
Syntax of do while loop:
do {
// Code to be executed
}
while(condition);
The do…while loop is very similar to while loop. The main difference is that in do…while loop, if the condition is false, the do-while loop will execute the block of code once.
Example 1: do-while loop
<script>
var i = 1;
do {
document.write(i + "<br/>");
i++;
}
while(i <= 0);
</script>
3: For Loop
The forloop, the specified condition is evaluated at the beginning of the loop. Even a repeated block of code until the specified condition is met true.
Syntax of while loop:
for(initialization; condition; increment/decrement) {
// Code to be executed
}
Here,
- Initialization: Initialize a counter variable to start with.
- Condition: specify a condition that must evaluate to true for next iteration.
- Iteration: increase or decrease counter.
Example 1: For loop
<script>
for(var i=1; i<=5; i++) {
document.write( i + "<br>");
}
</script>
4: for-of Loop
The for/of loop through the values of an iterable object in javascript.
Syntax of for-of loop:
for(variable in object) {
// Code to be executed
}
Example 1: for-of loop
<script>
// asign string to var
let str = "My Class!";
for(let character of str) {
document.write(character + "<br>");
}
</script>
5: The for-in Loop
The for-in loop is a special type of a loop that iterates over the properties of an object, or the elements of an array.
Syntax of for-in loop:
for(variable in object) {
// Code to be executed
}
Example 1: for-in loop
<script>
// javascript object
var info = {"fname": "Tony", "lname": "Hill", "age": "25"};
// iterate object using for-in Loop
for(var pinfo in info) {
document.write("<p>" + pinfo + " = " + info[pinfo] + "</p>");
}
</script>
Conclusion
In this javascript tutorial, you have learned javascript loop such as for, do-while, while, for-in, and for-of, loop.