JavaScript For Loop
JavaScript For Loop
The JavaScript for loop is used to execute a block of code repeteatedly, until a specified condition
evaluates to false. It can be used for iteration if the number of iteration is fixed and known.
The JavaScript loops are used to execute the particular block of code repeatedly. The 'for' loop is the
most compact form of looping. It includes the following three important parts
Condition − The condition expression which will test if a given condition is true or not. If the
condition is true, then the code given inside the loop will be executed. Otherwise, the control
will come out of the loop.
Iteration − The iteration expression is where you can increase or decrease your counter.
You can put all the three parts in a single line separated by semicolons.
Flow Chart
The flow chart of a for loop in JavaScript would be as follows −
Page 2 of 9
Advertisement
-
Syntax
The syntax of for loop is JavaScript is as follows −
Examples
Try the following examples to learn how a for loop works in JavaScript.
In the example below, we used the for loop to print the output's updated value of the 'count' variable. In
each iteration of the loop, we increment the value of 'count' by 1 and print in the output.
Open Compiler
<html>
<head>
<title> JavaScript - for loop </title>
</head>
<body>
<p id = "output"> </p>
<script>
const output = document.getElementById("output");
output.innerHTML = "Starting Loop <br>";
let count;
for (let count = 0; count < 10; count++) {
output.innerHTML += "Current Count : " + count + "<br/>";
}
output.innerHTML += "Loop stopped!";
</script>
</body>
</html>
Output
Starting Loop
Current Count : 0
Current Count : 1
Current Count : 2
Current Count : 3
Current Count : 4
Current Count : 5
Current Count : 6
Current Count : 7
Page 4 of 9
Current Count : 8
Current Count : 9
Loop stopped!
The below code demonstrates that the first statement is optional in the for loop. You can also
initialize the variable outside the loop and use it with the loop.
Whenever you need to use the looping variable, even after the execution of the loop is completed, you
can initialize a variable in the parent scope of the loop, as we have done in the below code. We also
print the value of p outside the loop.
Open Compiler
<html>
<head>
<title> Initialization is optional in for loop </title>
</head>
<body>
<p id = "output"> </p>
<script>
let output = document.getElementById("output");
var p = 0;
for (; p < 5; p++) {
output.innerHTML += "P -> " + p + "<br/>";
}
output.innerHTML += "Outside the loop! <br>";
output.innerHTML += "P -> " + p + "<br/>";
</script>
</body>
</html>
Output
P -> 0
P -> 1
P -> 2
P -> 3
P -> 4
Page 5 of 9
Open Compiler
<html>
<head>
<title> Conditional statement is optional in for loop </title>
</head>
<body>
<p id = "output"> </p>
<script>
let output = document.getElementById("output");
let arr = [10, 3, 76, 23, 890, 123, 54]
var p = 0;
for (; ; p++) {
if (p >= arr.length) {
break;
}
output.innerHTML += "arr[" + p + "] -> " + arr[p] + "
<br/>";
}
</script>
</body>
</html>
Output
arr[0] -> 10
arr[1] -> 3
arr[2] -> 76
arr[3] -> 23
arr[4] -> 890
Page 6 of 9
In the for loop, the third statement is also optional and is used to increment the iterative variable. The
alternative solution is that we can update the iterative variable inside the loop body.
Open Compiler
<html>
<head>
<title> Iteration statement is optional </title>
</head>
<body>
<p id = "output"> </p>
<script>
let output = document.getElementById("output");
let str = "Tutorialspoint";
var p = 0;
for (; ;) {
if (p >= str.length) {
break;
}
output.innerHTML += "str[" + p + "] -> " + str[p] + "
<br/>";
p++;
}
</script>
</body>
</html>
Output
str[0] -> T
str[1] -> u
str[2] -> t
str[3] -> o
str[4] -> r
str[5] -> i
str[6] -> a
Page 7 of 9
str[7] -> l
str[8] -> s
str[9] -> p
str[10] -> o
str[11] -> i
str[12] -> n
str[13] -> t
TOP TUTORIALS
Python Tutorial
Java Tutorial
C++ Tutorial
C Programming Tutorial
C# Tutorial
PHP Tutorial
R Tutorial
HTML Tutorial
CSS Tutorial
JavaScript Tutorial
SQL Tutorial
TRENDING TECHNOLOGIES
Git Tutorial
Docker Tutorial
Kubernetes Tutorial
DSA Tutorial
SDLC Tutorial
Unix Tutorial
Page 8 of 9
CERTIFICATIONS
DevOps Certification
Online Go Compiler
Online C Compiler
Online C# Compiler
Online PHP Compiler
Tutorials Point is a leading Ed Tech company striving to provide the best learning material on technical
and non-technical subjects.