JavaScript While Loop

About JavaScript While Loop

In JavaScript, while loop is a control flow statement that repeatedly executes a block of code as long as a specified condition is true.

In while loop, the condition must be a boolean expression that evaluates to true or false.

In while loop, the condition must eventually become false. Otherwise, the loop will run indefinitely.

It is important that the condition changes within the loop's body and eventually becomes false.  

Syntax of 'while' Statement

The general syntax of 'while' statement is as follows:

Components of While Loop
  • while: The 'while' keyword defines the while loop.
  • condition: 'condition' is passed as a boolean expression. The loop repeatedly executes a block of code as long as the specified condition is true. If the condition is false, the loop will stop and move to the next part of the program.
  • Code Block: The block of code will be executed when the condition is true.
  • Condition Update: The condition must be updated to make it eventually false. Otherwise, the loop will run indefinitely.

Create 'while' Loop Statement

In the following example, a while loop statement is created that prints numbers from 1 to 5.

Example of 'while' Loop Statemnt
Output of the above example
1
2
3
4
5
                                
Explanation of the code
  • let num = 1;: This line declares a variable named 'num' and assigns number 1.
  • while(num <= 5): The 'while' is the keyword that starts the 'while' statemnt. num <= 5 is the condition. As long as, the value of 'num' variable is less than or equal to 5, the loop will repeatedly execute the block of code inside the curly braces '{}'.
  • console.log(num);: The block of code executes if the condition is true.
  • num++;: It updates the value of 'num' variable by increamenting the value by 1 at each iteration. If the 'num' value is not updated, the loop will run indefinitely.

Breaking Out of 'while' Loop

The 'break' statement is used to exit a loop prematurely if certain condition is met.

Example of Breaking Out of 'while' Loop
Output of the above example
1
2
3
4
5
6
7
                                

Skipping Iteration of 'while' Loop

The 'continue' statement is used to skip the current iteration of a loop if certain condition is met.

Example of Skipping Iteration of 'while' Loop
Output of the above example
1
3
5
7
9
                                

Nested While Loops (Advanced Level)

A 'while' loop can be nested inside another 'while' loop and it is known as neated loop. Nested 'while' loops are used to handle multi-level operations.

But it is not always recommended as it can lead to complexity and harder-to-read code.

Example of Nested 'while' Loop Statemnt
Output of the above example
*
**
***
****
*****
                            

JavaScript Compiler For Live Practice

Practice the above JavaScript code in the following JavaScript Editor. Create more JavaScript 'while' loop statements in the following editor and click Execute button to check the output. The output will be displayed in JavaScript Code Output section.

JavaScript logo JavaScript Editor
JavaScript Code Output