JavaScript For Loop Explained with Syntax and Real-World Examples.

by


JavaScript for loop is used for repeat multiple task one by one at a time. for loop is most important of loops because it is use on many programming language like a, c++, JavaScript, asp.net. In this blog you will learn the What is JavaScript for loop with syntax and practice real word examples. so You can use on your local code with step-by-step.

First we need to understand the Definition, Syntax of for loops and why it is used because JavaScript support Multiple loops such as while, do-while, forEach, for-in, and for-of. JavaScript also provides looping methods like forEach(), which is commonly used with arrays.

JavaScript for loop syntax explained with initialization, condition, and increment example

What Is a JavaScript For Loop?

A JavaScript for loop is a use full for a execute the many block of code one by one until test condition match. It is simple loops start with for keyword and the are the three steps Initialization, Condition and Increment/Decrements. You will do not the write one same line multiple times if you are using the JavaScript for loop.

for loop JavaScript approach

If you have a known number of iterations, You need to access the index of iterations and You want to full control of the for loops.

JavaScript For Loop Syntax

There are the tree part of JavaScript for loop syntax. First one is Initialization, Second is condition and last is increment/decrement.

for (initialization; condition; increment/decrement) {
  // code to be executed inside for loop
}

for is a keyword and Initialization is part of the syntax it is use for initialize the value of a variable.

Condition is the main important part because it is decide the loops run or not. It is return true or false. If it is true then loops continuously run. if it is false then stop the for loops.

Increment/Decrement is last part of syntax. Is it update the value after each iterations.

Simple JavaScript For Loop Example

for (let i = 10  ; i <15; i++) {
  console.log("Display the I Values :", i);
}

Output: for loop exmple

Display the I Values: 10
Display the I Values: 11
Display the I Values: 12
Display the I Values: 13
Display the I Values: 14

In this example Variable i start with the 10 and end with 14 because condition is 10<15. and it is print the 5 time with different i values 10 to 14.

You can use different the variable name no need to use i. Variable i uses is the habit of all for loops developers.

JavaScript For Loop with Array Example

Every developer have a knowledge about the simple for loop. We will understand with the array examples. most common uses of the java script for loop is use full for the array data handling.

const languages = ["JavaScript", "Python", "Java", "React", "Node", "PHP", "TypeScript, "Ruby", "Java (Android)", "Dart (Flutter)" ];

for (let i = 0; i < languages.length; i++) {
  console.log(languages[i]);
}

In this example You can see the every language one by one. Is it is displaying start with the JavaScript and end with the Dart(Flutter). Once you understand for loops, you can move to advanced array methods such as reduce() for data transformation.

Real-World Example of JavaScript for loop.

Real word for loop is use full a shopping cart calculation and billing systems. We will understand with the Total Price calculation.

const prices = [100, 250, 150, 300, 400, 500, 600, 7000, 800, 900, 1000];
let total = 0;

for (let i = 0; i < prices.length; i++) {
  total += prices[i];
}

console.log("Total Price:", total);

for loops start with 100 and ends with 1000 and calculate the total price of all prices array.

Reverse Loop Example in JavaScript

A JavaScript for loop is also work on reverse using last syntax decrements. 

for (let i = 500; i >= 100; i--) {
  console.log(i);
}

In this example loops start with the 500 end with 100 using reverse decrement methods.

Using break and continue in JavaScript For Loop

break and continue is most important if you have leave or skip the iterations of loop.

break is used for the You want to stop the loop.

continue is used for You want to skip the particular iterations.

Both are use on for loop with deferent behaviors. break and continue is make sure a small latter it is a keyword.

break Example: for loop

for (let i = 101; i <= 210; i++) {
  if (i === 150) {
    break;
  }
  console.log(i);
}

continue Example:

for (let i = 101; i <= 210; i++) {
  if (i ===150) {
    continue;
  }
  console.log(i);
}

In First example Loop start with 101 and end with 150 after 150 it will be break the loop because We have used the break keyword. and Second example it is only skip the 150 not stopped full the loop. and are you preparing the interview you must read the JavaScript interview question and answer.

Leave a Comment