var Vs let Vs const

Hello everyone!!!!!

This time I'll discuss about the difference between the basic three types of variable in JavaScript var , const and let. Basically I'll discuss about the three major difference between them i.e.; their scope, their reassigning and redeclaration and their hoisting.

var

1. Scope : var if used inside a function then it is said to be function scoped or locally scoped variable but if it is used outside any function it is said to be globally scoped variable.

var msgOne="Good morning";

function greet () {
var msgTwo= "Good day";
}

console.log(msgTwo);

So, if you will run the above example you'll get an error msg that the msgTwo is not defined, this is because the msgTwo variable is defined and declared inside a function and is non accessible outside that function greet().

2. Reassigning and Redeclaration : This variable can be reassigned or redeclared within the same scope.

function welcome(){
var message = "hii";
var message = "hello";
 console.log(message);
}
welcome();

In the above example, you can see that if you'll run this piece of code you'll get the message as hello ,this shows that the var variable can be redeclared and reassigned within same scope.

3. Hoisting: var variables are hoisted at the top of their scope before the code execution and also is initialized with a value undefined.

let

1. Scope : let is also a blocked scoped variable that is non accessible outside that block i.e.; the curly brackets {}.

let count = 3 ;

if( count < 5){
let output = "hello";
console.log(output);
}

console.log(output);

So, if you will run the above example you'll get an error msg at line number 8 that output is not defined, this is because the output variable is defined and declared inside a block and is non accessible outside that block.

2. Reassigning and Redeclaration : This variable can be reassigned but cannot be redeclared.

function number(){
let digit = "hii";
digit = "hello";
console.log(digit);
}
number();

function draw(){
let art = "hii";
let art = "hello";
console.log(art);
}
draw();

In the above example, you can see that if you'll run the first piece of code you'll get the digit as hello , this shows that the let variable can be reassigned, but if you'll run the second piece of code
you'll get an error that identifier "art" is also declared , this shows that let cannot be redeclared.

3. Hoisting: let variables are also hoisted at the top of their scope before the code execution but are not initialized with any value like var.

const

1. Scope : const is a blocked scoped variable that is non accessible outside that block i.e.; the curly brackets {}.

const count = 3 ;

if( count < 5){
const output = "hello";
console.log(output);
}

console.log(output);

So, if you will run the above example you'll get an error msg at line number 8 that output is not defined, this is because the output variable is defined and declared inside a block and is non accessible outside that block.

2. Reassigning and Redeclaration : This variable can neither be redeclared nor reassigned.

function welcome(){
const message = "hii";
const message = "hello";
console.log(message);
}
welcome();

function draw(){
const art = "hii";
art = "hello";
console.log(art);
}
draw();

In the above example, you can see that if you'll run this piece of code you'll get the message as the the identifier message has been already declared ,this shows that the const variable cannot be redeclared and if you run the second piece of code you'll get an error that assignment to constant variable error, this shows that it cannot be reassigned as well.

3. Hoisting: const variables are hoisted at the top of their scope before the code execution but are not initialized with any value like var.

Happy Reading!!!