An Introduction to Loops in JavaScript

Do some repetitive tasks using loop
An Introduction to Loops in JavaScript

Table of Contents

  1. Types of Loop
  2. while loop
  3. do..while loop
  4. A closer look
  5. Non-specific (unknown) condition
  6. Conclusion

No matter which programming language you belong to or which programming language you are going to learn, loops are the fundamental topic in programming.

They are used to do a specific task over and over again for a given number of time under certain condition.

Mark the above three keywords:

  • over and over
  • given number
  • certain condition

That's all you need to write a looping statement.

Types of Loop

In any typical programming language there are three types of loop exists:

  • while
  • do..while
  • for

while and do..while are often used when the condition is not specific (unknown). But for is used when the condition is fixed.

So let's understand a bit more about them:

'while' loop:

Syntax

    
    while(condition){
        // execuatable statement
    }
    

'do..while' loop:

Syntax

    
    do{
        // execuatable statement    
    }
    while(condition);
    

A closer look:

In while loop:

  • check the condition first
  • then execute the statement

Whereas in do..while loop:

  • execute the statement (at least one time)
  • then check the condition

Let's understand the difference with a simple example:

Print the number from 1 to 10

while loop

    
    let num = 1; // declare and assign a variable num with value 1
    while(num <= 10){ // check while value is less than or equals to 10
        console.log(num); // execute the statement
        num = num+1; // increase the value of num by 1 each time
    }
    

do..while loop

    
    let num = 1; // declare and assign a variable num with value 1
    do{
        console.log(num); // execute the statement
        num = num+1; // increase the value of num by 1 each time
    }while(num<=10) // check while value is less than or equals to 10
    

If you see the above syntax and example of both while and do..while loop, you can easily extract the difference between them.

for loop

Like i mention earlier, the for loop is used with a fixed condition.

Syntax:

    
    for(initialize; check-for-condition; increment){
        //executable statement
    }
    

Confuse ?, No worry

Let's elaborate with the same example above:

Print the number from 1 to 10

    
    for(let num=1; num<=10; num=num+1){
        console.log(num);
    }
    

for let us assign, check for condition and increment in one single block.

So that's the basic all you need to use loop in your upcoming programs.

But wait !

What about non-specific (unknown) condition in while and do..while loop

Glad you ask.

These are the condition when you want to check for the condition, but you don't know how many times the condition would be checked.

In that scenario always use while or do..while loop.

Here are some real world scenarios for using while and do..while loop:

1. Play Music untill the pause button is pressed

    
    while(button != pause){
        play the music
    }
    

2. Repeat the question untill user press yes or no

    
    while(button != yes || button != no){
        ask question again
    }
    

2. Wash hands till hands are firty

    
    do{
        wash_hands
    }while(hands_are_dirty)
    

Hope these scenario can help you to understand where while and do..while loop used in real world.

We'll disucss more about them in depth in our future article.

Conclusion

Loops are the fundamental concept of every programming language which let us to do some specific task over and over again till certain condition.

Here are the three basic types of loop:

  • while
  • do..while
  • for

References

Thanks for sticking around. Keep Learning.