JavaScript Loops
JavaScript while Loop
The JavaScript
whileloop is used to repeat a block of code as long as a condition is true.
It is useful when you do not know exactly how many times the loop should run.
Example
Example
javascript
let i = 1;
while (i <= 5) {
console.log(i);
i++;
}In this example, the loop runs while i is less than or equal to 5.
What is a while Loop?
A while loop checks a condition before running the code block.
If the condition is true, the code inside the loop runs.
If the condition is false, the loop stops.
Syntax
Syntax
javascript
while (condition) {
// code to repeat
}The condition is written inside parentheses ().
The code to repeat is written inside curly braces {}.
Simple while Loop Example
Simple while Loop Example
javascript
let count = 1;
while (count <= 3) {
console.log("Hello JavaScript");
count++;
}Here, the message runs three times.
The value of count increases after every loop run.
Understanding How while Loop Works
Example
Understanding How while Loop Works
javascript
let number = 1;
while (number <= 5) {
console.log(number);
number++;
}Step by step:
| Step | Value of number | Condition | Result |
|---|---|---|---|
| 1 | 1 | 1 <= 5 | Runs |
| 2 | 2 | 2 <= 5 | Runs |
| 3 | 3 | 3 <= 5 | Runs |
| 4 | 4 | 4 <= 5 | Runs |
| 5 | 5 | 5 <= 5 | Runs |
| 6 | 6 | 6 <= 5 | Stops |
Counting Numbers with while Loop
You can use a while loop to count numbers.
Example
Counting Numbers with while Loop
javascript
let i = 1;
while (i <= 10) {
console.log(i);
i++;
}This prints numbers from 1 to 10.
Counting Backward
You can also count backward using a while loop.
Example
Counting Backward
javascript
let i = 5;
while (i >= 1) {
console.log(i);
i--;
}This prints numbers from 5 to 1.
while Loop with Arrays
A while loop can be used to read array values.
Example
while Loop with Arrays
javascript
let fruits = ["Apple", "Banana", "Mango"];
let i = 0;
while (i < fruits.length) {
console.log(fruits[i]);
i++;
}Here, the loop runs until all array items are printed.
while Loop with Strings
You can also use a while loop to read characters from a string.
Example
while Loop with Strings
javascript
let name = "John";
let i = 0;
while (i < name.length) {
console.log(name[i]);
i++;
}This prints each character of "John" one by one.
Updating the Loop Variable
In a while loop, you must update the loop variable manually.
Example
Updating the Loop Variable
javascript
let i = 1;
while (i <= 5) {
console.log(i);
i++;
}Here, i++ is important.
It increases the value of i after every loop run.
Without this update, the loop may never stop.
Complete Example
Complete Example
html
<!DOCTYPE html>
<html>
<head>
<title>JavaScript while Loop</title>
</head>
<body>
<h1>JavaScript while Loop</h1>
<p id="result"></p>
<script>
let i = 1;
let result = "";
while (i <= 5) {
result += "Number: " + i + "<br>";
i++;
}
document.getElementById("result").innerHTML = result;
</script>
</body>
</html>Try It Yourself
Run the above example in the Try It Editor.
Try changing the condition.
Example
Try It Yourself
javascript
while (i <= 10) {
result += "Number: " + i + "<br>";
i++;
}Also try counting backward from 5 to 1.
Important Points
- The
whileloop repeats code while a condition is true. - The condition is checked before the code block runs.
- If the condition is false at the beginning, the loop does not run.
- You must update the loop variable manually.
- Without a proper update, a
whileloop can run forever. - A
whileloop is useful when you do not know the exact number of repetitions in advance.
Conclusion
The JavaScript while loop is used to repeat code as long as a condition remains true.
It is useful when the number of repetitions depends on a condition.
Understanding the while loop helps you handle repeated tasks, dynamic checks, arrays, strings, and many real-world JavaScript problems.