JavaScript | For Loop

Looping in programming languages is a feature which facilitates the execution of a set of instructions repeatedly until some condition evaluates and becomes false. We come across for loop which provides a brief and systematic way of writing loop structure . This loop contains three statement inside

  • Statement 1 is initialization of counter it executed (one time) before the execution of the code block.
  • Statement 2 is testing statement that defines the condition for executing the code block It must return a boolean value. It is also an Entry Control Loop as the condition is checked before the execution of the loop statements.
  • Statement 3 is increment or decrement of counter & executed (every time) after the code block has been executed.
filter_none

edit
close

play_arrow

link
brightness_4
code

<script type = "text/javaScript"
// JavaScript program to illustrate for loop
    var x; 
    
    // for loop begins when x=2 
    // and runs till x <=4 
    for (x = 2; x <= 4; x++)  
    
        document.write("Value of x:" + x + "<br />"); 
    
    
< /script> 

chevron_right


Output :

Value of x:2
Value of x:3
Value of x:4

Flow chart :



Statement 1
we can do initialization of counter variable externally rather than in statement one, it is optional. we can left the portion empty with a semicolon for example

filter_none

edit
close

play_arrow

link
brightness_4
code

<script>
    var x = 2; 
    
    for ( ; x <= 4; x++)  
    
        document.write("Value of x:" + x + "<br />"); 
    }  
</script>

chevron_right


Statement 2
This statement checks boolean value if true for loop will execute further it is executed every time loop runs. If this statement returns true, the loop will start over again, if it returns false, the loop will end. This is also an optional statement and javascript treat it as true if left blank, a loop will run infinitely and affects browser if the loop would not break manually. It explained below

filter_none

edit
close

play_arrow

link
brightness_4
code

<script>
 var x = 2; 
 bool 
    for ( ; ; x++)  
    
        document.write("Value of x:" + x + "<br />"); 
        break;
    }  
</script>

chevron_right


Statement 3
It is controlled statement which controls the increment/decrement of counter variable it is also optional can be justified inside the for loop example:-

filter_none

edit
close

play_arrow

link
brightness_4
code

<script>
var i = 0;
var len = 2;
var gfg = "";
for (; i < len; ) { 
  gfg += cars[i] + "<br>";
//can be increased inside loop
  i++;
}
</script>

chevron_right


for/in

There is another advance loop for/in loop which run through the properties of an object. The loop will be executed once for each property of the object.

Syntax : for (var in object) { statements to be executed } 

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
<body style = "text-align:center;"
  
<h1 style = "color:green;"
GeeksForGeeks 
</h1> 
  
<button onclick="GFG()">Try it</button>
  
<p id="demo"></p>
  
<script>
function GFG() {
  var Platform= {fname:"geeks", Mname:"for", lname:"geeks", }; 
    
  var text = "";
  var x;
  for (x in Platform) {
    text += Platform[x] + " ";
  }
  document.getElementById("demo").innerHTML = text;
}
</script>
  
</body>
</html>

chevron_right


Output :



My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.