JavaScript Loops — PBA Institute Tutorial
Chapter 04 · JavaScript Programming Series
12 min read Beginner

JavaScript Loops

Loops let you repeat a block of code many times. JavaScript provides for, while, do…while, for…of, and for…in loops to handle every kind of repetition.

What is a Loop?

A loop is a control structure that repeats a block of code while a condition is true. Loops save time, reduce code, and make iteration over arrays and collections easy.

Types of Loops in JavaScript

🔁

for Loop

Repeats with a counter — best when the number of iterations is known.

♻️

while Loop

Runs while a condition is true — checks condition first.

🔂

do…while Loop

Runs at least once, then checks the condition.

📦

for…of

Iterates over the values of an iterable (array, string).

🔑

for…in

Iterates over the keys / indexes of an object or array.

break / continue

Exit the loop early or skip to the next iteration.

Loops in JavaScript

A loop in JavaScript is a programming construct that executes a block of code repeatedly while a condition remains true. Loops are used for automation, iteration, calculations, and pattern generation.

Basic Features

  • Every loop has initialization, condition, and update.
  • Loops reduce repetitive coding.
  • break exits the loop.
  • continue skips the current iteration.
  • Nested loops are used for patterns and tables.

Types of Loops

  • for loop
  • while loop
  • do while loop
  • for...in loop
  • for...of loop

Syntax of Loops

All Loop Syntaxes
// for loop
for(let i=0; i<5; i++){

}

// while loop
while(condition){

}

// do while loop
do{

}while(condition);

// for...of
for(let value of array){

}

// for...in
for(let key in object){

}

for Loop

A for loop executes a block of code repeatedly for a fixed number of times.

Print 1 to 5
<script>

for(let i=1;i<=5;i++){

    document.write(i+" ");

}

</script>
Output 1 2 3 4 5
Factorial Program
<script>

var n = 5;
var f = 1;

for(i=1;i<=n;i++){

    f = f * i;

}

document.write(
"Factorial = " + f
);

</script>
Output Factorial = 120
Prime Number Program
<script>

var a = 5;
var c = 0;

for(i=1;i<=a;i++){

    if(a%i==0){

        c++;

    }

}

if(c==2){

    document.write("Prime");

}else{

    document.write("Not Prime");

}

</script>
Output Prime

while Loop

A while loop executes repeatedly as long as the condition is true.

while Loop Example
<script>

var i = 0;

while(i < 5){

    document.write(i+" ");

    i++;

}

</script>
Output 0 1 2 3 4
Palindrome Number
<script>

var a = 121;
var s = 0;
var t = a;

while(a>0){

    r = parseInt(a%10);

    s = s*10+r;

    a = parseInt(a/10);

}

if(s==t){

    document.write(
    "Palindrome"
    );

}else{

    document.write(
    "Not Palindrome"
    );

}

</script>
Output Palindrome

do while Loop

A do while loop executes the code block at least once before checking the condition.

do while Example
<script>

var i = 0;

do{

    document.write(i+" ");

    i++;

}while(i<5);

</script>
Output 0 1 2 3 4

for...in Loop

The for...in loop iterates through object properties.

Object Loop Example
<script>

const Person = {

    name:"Rokeiya",
    class:12

};

for(let key in Person){

    document.write(
    key + " => " +
    Person[key]
    );

}

</script>
Output name => Rokeiya
class => 12

for...of Loop

The for...of loop is used to iterate through arrays and iterable objects.

Array Loop Example
<script>

const fruits = [

"Apple",
"Banana",
"Cherry"

];

for(const fruit of fruits){

    document.write(
    fruit + "<br>"
    );

}

</script>
Output Apple
Banana
Cherry

break and continue

break exits the loop while continue skips the current iteration.

break and continue Example
<script>

for(let i=1;i<=10;i++){

    if(i==5){

        continue;

    }

    if(i==8){

        break;

    }

    document.write(i+" ");

}

</script>
Output 1 2 3 4 6 7

Practice Exercises

  • Write a program to check whether a number is Perfect or not.
  • Write a program to print multiplication tables.
  • Write a program to reverse a number using loops.

Conclusion

Loops are one of the most important concepts in JavaScript programming. They help automate repetitive tasks, process data efficiently, and build complex applications easily.

Important Notes

  • Always make sure the loop variable changes — otherwise the loop never ends.
  • let creates a fresh variable per iteration, which is safer than var.
  • Use for…of for arrays and for…in for object keys.
  • Nested loops can be slow — be careful with very large data sets.

Real-Life Use Cases

📊

Data Listing

Print rows of products, students, or messages from an array.

🧮

Calculations

Sum, average, factorial, GCD — anything repetitive.

🔍

Searching

Loop through an array to find a value or index.

Patterns

Stars, numbers, pyramids — built with nested loops.

Practice Questions

  • Print the multiplication table of any number entered by the user.
  • Print all even numbers from 1 to 50 using a for loop.
  • Find the factorial of a number using a while loop.
  • Count the vowels in a given string using a for…of loop.
  • Print 1 to 100 but skip multiples of 7 using continue.

Frequently Asked Questions

QuestionAnswer
Q. Which loop should I use first?If you know the count, use for. If you only have a condition, use while.
Q. What is an infinite loop?A loop where the condition never becomes false. It hangs the browser — avoid it.
Q. Is do-while ever needed?Yes, when the code must run at least once before checking the condition, like a menu prompt.
Q. What's the difference between break and return?break exits a loop; return exits a whole function.
Q. Why use forEach over for?forEach is cleaner for arrays, but cannot use break. Use for when you need control.

Conclusion

Loops are essential for any non-trivial program. Mastering for, while, do-while, for-of and for-in gives you the power to handle data, automate tasks, and build patterns elegantly in JavaScript.

JavaScript All Chapters

Continue Learning

Previous

Go to If Else Chapter

Next

Go to Array Chapter