JavaScript Loop

loop statements are used to repeat the specific piece of code using various loops.It make the code compress. We need not to make cases or iteration for each value.

There are four type of loops in JavaScript.

  1. for loop
  2. while loop
  3. do-while loop
  4. for-in loop

1.  for loop:- The JavaScript for loop repeat the elements for the fixed  number of times. It is used when we know the break point means we know the number of iterations.

Syntax:

for (initialization; condition; increment)  
{  
    code to be executed  
}

Example:

<!DOCTYPE html>
<html>
<body>
<script>  
for (i=1; i<=5; i++)  
{  
document.write(i + "<br/>")  
}  
</script>  
</body>
</html>

Explanation:-

  • We initiate i from 1.
  • Condition is, for loop will execute till i is less than or equals to 5.
  • Increment i by 1 each time.

2. while loop:-  The while loop  is used to iterate over a block of code as long as the test expression (condition) is true. The code-block of while is execute only when condition is true.

Syntax:

while (condition)  
{  
    code to be executed  
}

Example:

<!DOCTYPE html>
<html>
<body>
<script>  
var i=1;  
while (i<=5)  
{  
document.write(i + "<br/>");  
i++;  
}  
</script>  
</body>
</html>

Explanation:In the above example, the code in the loop will run, over and over again, as long as a variable (i) is less than or equal to 5.

3. do-while loop:- The do while loop iterates the elements for the infinite number of times like while loop. But, code is executed at least once whether condition is true or false. The syntax of do while loop is given below.

Syntax:

do{  
    code to be executed  
  }
while (condition);

Example:

<!DOCTYPE html>
<html>
<body>
<script>  
var i=1;  
do{  
document.write(i + "<br/>");  
i++;  
}while (i<=5);  
</script>  
</body>
</html>

Explanation:The above example uses a do-while loop. The loop will always execute at least once, even if the condition is false, because the code block is executed before the condition is tested.

Do not forget to increase the variable used in the condition, otherwise the loop will never end!

4. for-in loop: The for…in loop is used to access  the elements of object through loop.

Syntax:

for ( let var_name in object) 
{
   statement or block to execute
}

Example:

<!DOCTYPE html>
<html>
<body>
<p>The for in loops through the elements of an object</p>
<p id="demo"></p>

<script>
const black_cat = {fname:" Bombay ",gname:" Oriental ",hname:" Sphynx ",iname:" Ragamuffin ",jname:" Chantilly-Tiffany ",kname:" Persian ",lname:" Exotic "}; 

let txt = "";
for (let x in black_cat) 
{
  txt += "<br>"+black_cat[x] ;
  
  document.getElementById("demo").innerHTML = txt;
  
}
</script>
</body>
</html>

Explanation:

  • The for in loop iterates over a black_cat object.
  • Each iteration returns a key of each element.
  • The key is used to access the value of the key.
  • The value of the key is black_cat[x].

value of black_cat[0]=”Bombay”

value of black_cat[1]=”Oriental”

value of black_cat[2]=”Sphynx”

.

.

.

value of black_cat[6]=”Exotic”