Photo by Sincerely Media on Unsplash
JavaScript - The 'let' keyword behaviour
Declaring variable in modern JavaScript
Introduction
Namaste, In this post I will discuss the below topics
What is the 'let' keyword?
Using the 'let' keyword in the global scope
Using the 'let' keyword in the function scope
Cannot re-declare a variable
Using the 'let' keyword in the block scope
Benefits of 'let' keyword
Complete source code
Video Tutorial
What is the 'let' keyword?
The 'let' keyword is used for declaring variables or objects in Modern Javascript. It was added to Javascript because of various limitations of the 'var' keyword. It is recommended to always use the 'let' keyword over the 'var' keyword. The variables or objects declared using the 'let' keyword are not hoisted.
Using the 'let' keyword in the global scope
Since variables or objects declared using the 'let' keyword are not hoisted they are available only after initialization. Accessing before the initialization yields an error.
// 'let' keyword in global scope
let myval=100;
console.log ("myval", myval); // 100
console.log ("myval2", myval2); // error
let myval2=101;
Using the 'let' keyword in the function scope
// 'let' keyword in function scope
function fx() {
let myval3=200;
console.log ("myval3", myval3); // 200
console.log ("myval4", myval4); // error
let myval4=201;
}
fx();
Cannot re-declare a variable
Once declared using the 'let' keyword the variable cannot be re-declared.
// cannot re-declare
let myval5=30;
let myval5=40; // error
Block Scope and 'let' keyword
The variables declared using the 'let' keyword have a block scope hence the variable would only be available in the given block after initialization.
// 'let' keyword and block scope
for (let a=10;a<11;a++) {
let b=12;
}
console.log("a,b:",a,b); // error for both - a or b
let i=13;
if ( i > 9){
let c = 13;
}
console.log("c:", c); // error
// Block scope inside function
function fx2() {
try {
let d=20;
}catch(e) {
console.log(e,d); // if executed - error here as well
}
console.log("d",d); // error
}
fx2();
Benefits of 'let' keyword
In modern Javascript 'let' keyword should always be used over the 'var' keyword.
The benefits are 'let' keyword are as follows
Variables are not re-declared
Variables are not hoisted
Variables have block scope
Complete Source Code
//Objective : Understanding the 'let' keyword behavior
//Author: Mahavir DS Rathore
// 'let' keyword in global scope
let myval=100;
console.log ("myval", myval); // 100
//console.log ("myval2", myval2); // error
let myval2=101;
// 'let' keyword in function scope
function fx() {
let myval3=200;
console.log ("myval3", myval3); // 200
//console.log ("myval4", myval4); // error
let myval4=201;
}
fx();
// cannot re-declare
let myval5=30;
//let myval5=40; // error
// 'let' keyword and block scope
for (let a=10;a<11;a++) {
let b=12;
}
//console.log("a,b:",a,b); // error for both - a or b
let i=13;
if ( i > 9){
let c = 13;
}
//console.log("c:", c); // error
// function scope -- no block scope inside function
function fx2() {
try {
let d=20;
}catch(e) {
console.log(e,d);
}
console.log("d",d); // error
}
fx2();