Javascript Basic – What is Loop in Javascript

Home /

Table of Contents

Javascript Loop

Sometimes we have to do the same things several times. In that case, we use the loop to do it quickly. Loops are handy, if you want to run the same code over and over again, each time with a different value.

Loops are a critical programming construct used in JavaScript to execute a block of code repeatedly based on a certain condition. They provide a convenient way to perform repetitive tasks, such as iterating through an array or processing large sets of data.

There are three types of loops in JavaScript: for, while, and do-while. Each type of loop has its own unique syntax and use cases.

Using loops in JavaScript can significantly increase the efficiency and effectiveness of your code. They enable you to perform tasks that would be difficult or impossible to do manually, such as performing a calculation on every element in an array. By iterating over arrays and other data structures, loops allow you to manipulate data in a dynamic and automated way, reducing the amount of repetitive code that you need to write.

There are many types of loops in programming. However, there are several types of loops in JavaScript. The following statements are used for loops:

  1. For statement
  2. Do…while statement
  3. While statement
  4. Break statement
  5. Continue statement

For statement

Like other programming languages, In Javascript ‘for loop’ works similarly. If you want to do something for a certain period, ‘ for loop’ is usually used. Here is the beginning, then how long it will last and how far you want to go at each end.

for (Start ; condition ; Step){
   		Statement;
}

Example:

for (var i=1 ; i <= 5 ; i++){
   console.log(i);
}

Output:

    1
    2
    3
    4
    5

Do…while Statement

The ‘do while’ loop is a variant of the while loop. This loop will execute the code block once before checking if the condition is true, then it will repeat the loop as long as the condition is true.

do {
   // code to be executed
}
while ( condition is true );

Example:

var num = 13;
do {
   console.log('Inside the loop, the number is: ' + num);
   num++;
}
while ( num < 10 );
console.log('Here we are outside the loop.');

Output:

Inside the loop, the number is: 13
Here we are outside the loop.

while Statement

The ‘while’ loop loops through a block of code as long as a specified condition is true.

while ( Condition is true ) {
   // Code Block or Statement
}

Example:

var num = 13;
while ( num < 15 ) {
  console.log('Inside the loop, the number is: ' + num);
  num++;
}
console.log('Out of the loop.');

Output:

Inside the loop, the number is: 13
Inside the loop, the number is: 14
Out of the loop.

Break Statement

You can also control the loop from inside the loop statement. If you want to exit the loop entirely at a given time in a moving loop, you can use the break statement.

Example:

for( var i = 0 ; i < 10 ; i++){
   if ( i == 5){
       break;
   }
   console.log('i is now at: ' + i);
};

Output:

i is now at: 0
i is now at: 1
i is now at: 2
i is now at: 3
i is now at: 4

Continue Statement

It is also used to control such loops. But in this case, it does not come out entirely from the loop rather than just skips that loop.

Example:

for( var i = 0 ; i <= 5 ; i++){
   if ( i == 2){
       console.log(i + ' is skipped.');
       continue;
   }
   console.log('i is now at: ' + i);
};

Output:

i is now at: 0
i is now at: 1
2 is skipped.
i is now at: 3
i is now at: 4
i is now at: 5

Loops also make it possible to create interactive and dynamic user interfaces. For example, you can use loops to generate HTML elements based on user input or to create animations that change over time. By updating the properties of an element in a loop, you can create the illusion of motion or change, making your application more engaging and responsive.

Loops are an essential tool in JavaScript that allows developers to write more efficient, scalable, and interactive applications. They help automate repetitive tasks and enable developers to work with large amounts of data in a dynamic and efficient way, making it possible to build complex and powerful applications that provide a better user experience.

Share The Tutorial With Your Friends
Twiter
Facebook
LinkedIn
Email
WhatsApp
Skype
Reddit

Check Our Ebook for This Online Course

Advanced topics are covered in this ebook with many practical examples.

Other Recommended Article