What is the difference between let, var, and const?
In this article, I’m explaining the importance of
these three keywords in JavaScript and TypeScript. I also provided various examples to deeply
understand and use them and what happened when?
Let
see about: Var vs. Let vs. Const
var:
-
1. var
is function-scoped
2. var
return undefined when accessing a variable before it's declared
let:
-
1. let
is block-scoped
2. let
throw ReferenceError when accessing a variable before it's declared
const:-
1. Const
is block-scoped
2. Const
throw ReferenceError when accessing a variable before it's declared
3. Const
cannot be reassigned
Let
see the Examples to understand what happens when -
What will happen when the following code is executed?
var
x = 5;
console.log(x);
if (true)
{
var
x = 6;
console.log(x);
}
console.log(x);
//The Output will
be -
5
6
6
What will happen when the following code is executed?
var
x = 5;
console.log(x);
if
(false) {
var
x = 6;
console.log(x);
}
console.log(x);
//The Output will
be -
5
5
What will happen when the following code is executed?
var
x = 5;
function
a() {
var
x = 6;
return
x;
}
console.log(x);
console.log(a());
//The Output will
be -
5
6
What will happen when the following code is executed?
var
x = 5;
function
a() {
x = 6;
return
x;
}
console.log(x);
console.log(a());
//The Output will
be -
5
6
What will happen when the following code is executed?
var
x = 5;
function
a() {
let
x = 6;
return
x;
}
console.log(x);
console.log(a());
//The Output will
be -
5
6
What will happen when the following code is executed?
let
x = 5;
function
a() {
let
x = 6;
return
x;
}
console.log(x);
console.log(a());
//The Output will
be -
Uncaught
SyntaxError: Identifier 'x' has already been declared
at<anonymous>:
1: 1
What will happen when the following code is executed?
const
x = 5;
function
a() {
let
x = 6;
return
x;
}
console.log(x);
console.log(a());
//The Output will
be -
Uncaught
SyntaxError: Identifier 'x' has already been declared
at<anonymous>:
1: 1
What will happen when the following code is executed?
const x
= 5;
function
a() {
x = 6;
return
x;
}
console.log(x);
console.log(a());
//The Output will
be -
Uncaught
SyntaxError: Identifier 'x' has already been declared
at<anonymous>:
1: 1
What will happen when the following code is executed?
const x
= 5;
function
a() {
const
x = 6;
return
x;
}
console.log(x);
console.log(a());
//The Output will
be -
Uncaught
SyntaxError: Identifier 'x' has already been declared
at<anonymous>:
1: 1
What will happen when the following code is executed?
const
x = 5;
function
a() {
var
x = 6;
return
x;
}
console.log(x);
console.log(a());
//The Output will
be -
Uncaught
SyntaxError: Identifier 'x' has already been declared
at<anonymous>:
1: 1
What will happen when the following code is executed?
var
x = 5;
function
a() {
const
x = 6;
return
x;
}
console.log(x);
console.log(a());
//The Output will
be -
5
6
What will happen when the following code is executed?
let
x = 5;
function
a() {
var
x = 6;
return
x;
}
console.log(x);
console.log(a());
//The Output will
be -
Uncaught
SyntaxError: Identifier 'x' has already been declared
at<anonymous>:
1: 1
What will happen when the following code is executed?
var
x = 5;
function
a() {
var
x = 6;
return
x;
}
x;
a();
//The Output will
be -
6
What will happen when the following code is executed?
var x = 5;
function
a() {
var
x = 6;
return
x;
}
x = a();
//The Output will
be -
6
What will happen when the following code is executed?
var
x = 5;
function
a() {
var
x = 6;
return
x;
}
x
//The Output will
be -
5
What will happen when the following code is executed?
var
x = 5;
function
a() {
var
x = 6;
return
x;
}
console.log(x);
console.log(a());
//The Output will
be -
5
6
What will happen when the following code is executed?
var
x = 5;
function
a() {
var
x = 6;
}
console.log(x);
console.log(a());
//The Output will
be -
5
What will happen when the following code is executed?
var
x = 5;
function
a() {
let
x = 6; return x;
}
console.log(x);
console.log(a());
//The Output will
be -
5
6
The Results Looks like this.