What is the difference between var,let and const in JavaScript..?

The ECMAScript Standard introduced new features in JavaScript Programming Language such as ‘let‘ and ‘const‘.

var,let and const are the keywords to declare variables in JavaScript. Let us see one by one,

var: The var keyword is used to declare a variable in JavaScript , these declarations are processed before the execution of code.

If the variable declared within a function or a method , then we can say that ‘The scope of the variable is within function’ .

Eg:

function testmyvar(){
           var i = 10; // assigning 10 to the var i
           console.log(i);
       }
      console.log(i);// here you cannot access the variable i.
You will see the error :Uncaught ReferenceError: i is not defined

Same time you can use the globally declared variable within your function and re-declare it .

if you modify the value of globally declared variable within your function, it will effects to the globally declared variable.

Eg:

var a = 10; // value of a is 10, globally declared 
if(a==10){ 
    var a = 20; // The value of a is changed to 20 
    console.log('Theue of a inside this scope is '+a); 
} 
console.log('Thebal variable value changed to '+a);

Overall we came to know that var keyword is used to declare a variable in JavaScript. The var variable declared as a global can be changed inside the function.

Re-Declaring the same variable within the same scope is valid with var keyword.

Eg:1

function redeclaretestwithvar(){ 
       var a =1;   
       var a =2;   
       console.log(a);  //will show you 2 
    }
Eg:2
    var a = 10; // value of a is 10, globally declared 
    var a = 5; 
    if(a==10){ 
      var a = 20; // The value of a is changed to 20 
      console.log('Theue of a inside this scope is '+a); 
    }
    console.log(a)// will show you 5;

Lets move to let keyword.

As we used var the let is also useful to declare a variable within the Block scope.and the globally assigned value can not be changed.

Eg:

function testLetFunction(){
  let a =10;
  console.log(a);  // show you 10
  if(a==10){
   let a=20;
   console.log(a); // show you 20
  }
  console.log(a);  // show you 10
}

As you can see in the above example , the value assigned to the variable a by let keyword is in block scope.
the value changed inside if() Block only. After the if() block, the value of a declared within the function scope was remains unchanged.

Re-Declaring the same variable within the same scope is invalid with let keyword, it will throw Uncaught SyntaxError.

function redeclareTestwithLet(){
  let a =5;
  let a =10; //Identifier 'a' has already been declared
  console.log(a); 
}

Const: Const is same as let except that const will not allow you to modify the value of it.
Eg:

const MY_CONST = 10;
function testConstFunctions();
  const MY_CONST = 20;
  console.log("insidetion  "+MY_CONST);  //output 20
}
console.log("Globale"+MY_CONST);// output 10

As you can see from above example the const declares a variable in local block scope.
Re-Declaring a const within a same block scope will throw an error.
Eg:

const MY_CONST = 10;
const MY_CONST = 20; // error :uncaught SyntaxError: Identifier 'MY_CONST' has already been declared
function testConstFunctions();
  const MY_CONST = 20;
  console.log("insidetion  "+MY_CONST);  //output 20
  const MY_CONST = 25; //uncaught SyntaxError: Identifier 'MY_CONST' has already been declared
}

Const variables cannot be changed but Const objects can be changed

JavaScript allows you to change a const object, you can change the properties of an object, you can add a new property to the const object, But you cannot reassign a object.

Eg:

//Declare a const object
   const student = {name:"Madan", Age:"25", class:"computer-Science"};
   console.log(student);
   //modify this object by adding a new property 
   student.gender="Male"; 
   console.log(student); // object will includes gender
   // Modify the value of any property of the same object
   student.name="Madanagouda   console.log(student);// object name is changed

But

student = {name:"Girish", Age:"25", class:"Electronics"};    // Uncaught TypeError: Assignment to constant variable.

In the same way const arrays can be changed but cannot be re assigned

//Declare a const array
   const planets = ["Mercury", "Venus", "Earth", "Mars","Ceres","Jupiter", "Saturn","Uranus","Neptune","Pluto"];
   console.log(planets);
   
  //add a new value to this const array
   planets.push="Ceres console.log(planets); // array will includes Ceres
   // Modify the existing array value
   planets[10]="Haumea"; 
   console.log(planets);// Array values changed
  
   planets.pop();// removed last element from your const array
   planets = ["Pluto", "Ceres", "Haumea", "Makemake","Eris"];// Uncaught TypeError: Assignment to constant variable.

Thanks for reading this Article.
hAppY cOdiNg.. ;