do-while loop in JavaScript with examples

Are you tired of writing code that must be executed at least once, regardless of whether the condition is true or false? Then look no further than JavaScript's do-while loop! The do-while loop is a must-know tool for any JavaScript developer looking to improve their coding skills, thanks to its unique structure and powerful functionality.

In this post, we'll go over do-while loops in JavaScript, including how they differ from other types of loops and when to use them. So let's start with a brief definition.

The do-while loop in JavaScript is used to execute some block of code once, regardless of the condition given to the loop, and then continue executing the same block of code until that condition evaluates to be false.

JavaScript do-while loop syntax

The syntax of the do-while loop in JavaScript is:

do {
   // body of the loop
   
} while(condition);

JavaScript's do-while loop is a particular kind of loop that runs a block of code at least once before repeating the execution of the block as long as a particular condition is still true.

Therefore, whatever block of code is written as the "body of the loop" will be executed once and then continue its execution until the specified "condition" evaluates to true. That is, first the "body of the loop" will be executed, then its "condition" will be evaluated; if it is true, then the "body of the loop" will again be executed, and then the "condition" again will be evaluated; if it is true, then program flow again enters the loop's body. This process continues until the "condition" evaluates to false.

JavaScript do-while loop example

Consider the following code as an example demonstrating the do-while loop in JavaScript:

HTML with JavaScript Code
<!DOCTYPE html>
<html>
<body>
   
   <script>
      let num = 6, i = 1;
      do {
         console.log(num*i);
         i++;
      } while(i<=10);
   </script>
   
</body>
</html>

The snapshot given below shows the sample output produced by the above JavaScript example:

javascript do while loop

Since the condition in the do-while loop is always given after the body of the loop, Therefore, the body of the loop will always be executed at once, regardless of the given condition. For example:

HTML with JavaScript Code
<!DOCTYPE html>
<html>
<body>
   
   <script>
      var x = 10;
      do {
         console.log("The value is: ", x);
         x++;
      } while(x>20);
   </script>
   
</body>
</html>

The output produced by the above example is:

do while loop javascript

In the above example, the condition x>20 or 11>20 (the value of x will be 11 after incrementing the value of x using the statement x++; available in the body of the loop) evaluates to false at first. Then also, the body of the loop was executed all at once or for the first time.

How is the do-while loop different from other types of loops?

JavaScript's do-while loop is a type of loop that resembles other loops like the "for" loop and "while" loop but differs in a few key ways.

Due to the fact that it always runs the code block at least once, even if the condition is immediately false, the do-while loop can be less effective than other loops. Performance overhead and pointless iterations may follow from this. As a result, it's crucial to carefully consider the use case and select the ideal loop construct for your particular situation.

JavaScript Online Test


« Previous Tutorial Next Tutorial »


Liked this post? Share it!