Var and Let Keyword

Prev Next

In this tutorial post we are going to discuss the following keywords var and let. We will see the difference between these keywords when it comes in use.

Var Keyword

The Var keyword comes from JavaScript before the advent of ES6. TypeScript is also used similar behavior.The below are the points need to discuss.

Var keyword introduce in JavaScript before the advent of ES6.
Var declarations can be globally or function scoped.
Var can be Redeclared and updated
Hosting of Var.

1. Var Keyword Introduce

The var keyword was introduced with JavaScript before the advent of ES6 or ES2015. It has also same behaviour in TypeScript.

2. Globally or Function Scope

using Var keyword variable can be define in two scope Global and Function Scope as following:

Function- variable declare with in the function. So it is the local to that function is called local or function scope.
Global- variable declared outside the function. So variable becomes global.

Function or local variable scope:

  var x =10;  // Global variable declaration
  function varcheck() :void{   
    var y = 20;  //Local or function variable declaration we can not access it outside the function.
      console.log(y);  // 20    
    }
    varcheck(); 
    console.log(x);  // 10

Var keyword has scope outside the block of code:

var Name = "Rohatash";  
var count = 6;  
if (count > 5) {  
   var Name = "Hello Rohatash";   
}  
console.log(Name) //Output- Hello Rohatash

3. Var Redeclared and Update

It means we can redefined variable in the same scope and also update it value and won't get an error.

//Var Redeclaration and update 
var r =10;  
var r = 20;// Global variable redeclaration 
console.log(r);  // 20

4. Hosting of Var

Hosting of Var means declarations of variales and function should be before execution of code.

//Hoisting of var
console.log (h);
var h = "Hoisting"

The above code show an error need to define before assign. Sovarvariables are hoisted to the top of their scope.

var h;
console.log (h);
h="Hoisting";

Let Keyword

The Let keyword comes from JavaScript in the advent of ES6(ES 2015) version. TypeScript is also used similar behavior.The below are the points which are differ from Var.

The Let keyword introduce in JavaScript in the advent of ES6
The Let keyword scope is limited to block scope
The Let can be updated but not Redeclared
Not Hosting of Let

1. Let Keyword Introduce

The Let keyword was introduced with JavaScript in the advent of ES6 or ES2015 version.

2. Block Scope

using Let keyword variable can be define only in block of code Scope as following:

let NameV = "Rohatash";  
var count = 6;  
if (count > 5) {  
   let NameV = "Let explain me";    
}  
console.log(NameV) //Output- Rohatash

In the above example it will not show the outside of block "Let explain me".

3. Let update but not Redeclared

It means we can update but not redefined variable in the same scope.

No Redeclaration

//Let Not Redeclaration 
let p =10;  
let p = 20;// Global variable redeclaration 
console.log(p);

Update

//Let  update 
let p =10;  
 p = 20;
console.log(p); //Output-20

4. Hosting of Let

Hosting of Let means declarations of variales and function should be before execution of code otherwise you'll get aError.

let h;
console.log (h);
h="Hoisting";

Var vs Let Keyword

SNo.	Var Keyword	Let Keyword
1	The Var keyword introduce in JavaScript before the advent of ES6.	The Let keyword introduce in JavaScript in the advent of ES6
2	Var declarations can be globally or function scoped.	The Let keyword scope is limited to block scope
3	Var can be Redeclared	The Let can not Redeclared
4	Var can be updated	The Let can be updated
5	Hosting of Var means declarations of variales and function should be before execution of code. It is initialized as undefined	Hosting of Var means declarations of variales and function should be before execution of code. It is left as uninitialized

Prev Next

Angular Tutorials

Var and Let Keyword

Top Articles