JavaScript variables declare outside or inside loop?

It is believed that there can be any performance-based differences when the variables are declared inside or outside the loops, but there will be no difference. As there is flexibility in any programming language to declare the variables as and when required which will be easy for the users to read and understand accordingly.

So, in JavaScript too the variables can be declared inside or outside the loop as per the users ease anywhere in the function body. And even variable declarations are not commands that are executed at the run-time. If the variable is declared outside the loop, then it has the global scope as it can be used through-out the function and inside of the loop too. If the variable is declared inside the loop, then the scope is only valid inside the loop and if used outside the loop will give an error.

Example 1

This example shows the declaration of variables in two types −

function myFunction1(){
    var i //global scope can be used through-out the function
    //statements
    for(i=0; i<3; i++){
        console.log("Hello");
    }
}
myFunction1();
function myFunction2(){
    //statements
    for(var i=0;i<2;i++){ // 'i' is only defined inside the loop
        console.log("Welcome");
    }
}
myFunction2();

A traditional way of programming is that all the variables will be declared at the beginning of the program, as the beginners who are learning a programming language are thought in the same way. This has no impact on the performance or any other run time issues but, if any variable is missed to be declared, assumed to be declared and used anywhere in the program will give an error.

As traditional approach of declaring the variables will miss the flow while reading, instead if declared where it is needed it will be easy to read.

Example 2

This is the example that shows the traditional way of declaration of variables −

function myFuntion(){
   var a=12
   var array=[12,34,56,6]
   var i=0; // all variables are declared at one place

   //statements
   for(i=0;i<array.length;i++){
      console.log(array[i]*a);
   }
}
myFuntion();

In the above example, that shows the declaration of traditional approach. All the variables which are used in the program are declared in the beginning. It is better to declare the variable in the loop as its validity will be only up to that block and the code can stand alone for that section.

So, to tell there is no difference in anything if either of the approaches are used. It is the user’s choice to decide to declare the variables wherever as there is no change in the output resulted while used either of the two. But most of the professional coders will be declaring only when it is needed or inside the loop to be specific.

But with let, this is not the case. let has lexical scoping. So unless you will need the same variable outside the loop (or if each iteration depends on an operation done to that variable in the previous iteration), it's preferable to declare the scope within which it is used.

Abdul Rawoof

Updated on: 26-Aug-2022

4K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started