Sunday, February 16, 2020

for Loop In JavaScript

for Loop In JavaScript

The "for-loop" is an iteration statement, and one of the most commonly used iteration statement in programming. When a block of code is required to execute multiple times in the same way, then we can use ''for-loop".  Generally, The "for-loop" iteration statement is used when the number of iterations is fixed and known in advance.
for example, you need to write "JavaScript" 5 times, for this, you can either write

document.write("JavaScript");
document.write("JavaScript");
document.write("JavaScript");
document.write("JavaScript");
document.write("JavaScript");

OR
for(i=0;i<5;i++)
   document.write("JavaScript");

It means we can reduce the effort and length of code considerably with the looping constructs like for, while and do-while.

The syntax for the "for-loop" is


for ([initialization]; [condition]; [update]) 
          Statement block

Initialization

Initialization is the first expression that occurs within for loop parenthesis, this expression is executed once at the starting of for loop. Generally, this a counter variable that can be tested against some condition and updated later.

Condition

Condition is a boolean expression, and it is executed every time the loop is iterated, only if this condition holds true then only the control of execution will move ahead, otherwise, the loop will halt.

Update

An update is an expression, that occurs before the next evaluation of the condition, Generally, this is an update of the counter declared in the initialization step.

Statement block

Statement block can carry single or multiple statements to be executed repeatedly over and over until the condition is failed. Generally, this block is kept within {......} brackets if we have multiple statements in the statement block. Otherwise, only the first statement will be iterated by the "for-loop".

for loop flow chart
"for-loop"

for example
<html>
  <head><title>for-loop-demo</title></head>
  <body bgcolor='yellow'>
    <script>
      for(i=0;i<5;i++)
      {
        document.write('<h2 style="color:green;">JavaScript for loop</h2>');
      }
    </script>
  </body>
</html>


We can leave any of the initialization, condition or update empty, but a minimum of two semicolons (;;) are must within the parenthesis after for. This must be done carefully as such a loop may run infinitely.

for example

for(;;)
document write('running infinite');

for /in loop

The "for-in" loop is a version of for-loop available in JavaScript, to loop through the properties of an object. We do not need to take care of initialization, condition or update statements in this loop, all of these will be managed by the loop itself.

for/of loop

The "for-of" loop is another version of for-loop in JavaScript, to iterate through an iterable object. We do not need to take care of initialization, condition or update statements in this loop, all of these will be managed by the loop itself.

for/in and for/of can prove more fruitful and safe execution in comparison to for-loop.