JavaScript Let
The let keyword in JavaScript is used to make variables that are scoped to the block they’re declared in. Once you’ve used let to define a variable, you cannot declare it again within the same block. It’s important to declare let variables before using them.
The let keyword was introduced in the ES6 or ES2015 version of JavaScript. It’s usually recommended to use let when you’re working with JavaScript.
Syntax:
let variable_name = value;1. Block Scope
The variables which are declared inside the { } block are known as block-scoped variables. variables declared by the var keyword cannot be block-scoped.
Example: In this example, the num variable is block-scoped and it cannot be accessed outside the block. If we try to access the variable outside the block it throws a reference error.
{
let num = 10;
// calling the function inside block
console.log(num)
}
// Calling a function outside
// block throws an Error
console.log(num)
Output:
10
Uncaught ReferenceError: num is not defined
2. Global Scope
A global scope variable is a variable declared in the main body of the source code, outside all functions.
Example: In this example, the num variable is a globally scoped variable and it can be accessed from anywhere in the program.
let num = 10;
console.log(num);
function fun() {
console.log(num);
}
fun(); // Calling the function
Output:
10
10
3. Function Scope
A function scope variable is a variable declared inside a function and cannot be accessed outside the function.
Example: In this example, the num variable is declared inside the function and cannot be accessed outside the function.
function fun() {
let num = 10;
console.log(num);
}
fun(); // Calling the function
console.log(num);
Output:
10
"ReferenceError: num is not defined
1. Redeclaring Variables in different blocks
The variables declared using let can be redeclared inside other blocks.
Example: In this example, variable x is redeclared inside other blocks.
let x = 77;
{
let x = 23;
console.log(x);
}
console.log(x);
Output:
23
77
2. Redeclaring Variables in the same blocks
We cannot redeclare variables using the let keyword inside the same blocks. It will throw an error.
Example: In this example, variable x is redeclared inside the same blocks.
let x = 77;
{
let x = 23; // legal
console.log(x);
}
let x = 67; // illegal
console.log(x);
Output:
Uncaught SyntaxError: Identifier 'x' has already been declared
Does not support Hoisting
The behavior of moving the declarations on top of the script is known as hoisting.
Example: Let do not support hoisting.
x = 12;
console.log(x);
let x;
Output:
Uncaught ReferenceError: Cannot access 'x' before initialization Supported Browser:
- Chrome 49 and above
- Edge 14 and above
- Firefox 44 and above
- Opera 17 and above
- Safari 10 and above
P.S: To clear your concept of var, and const, and let please go through How to declare variables in different ways in JavaScript?
JavaScript Let – FAQs
What is let in JavaScript?
let is a keyword used to declare variables in JavaScript, introduced in ES6, providing block scope, unlike var which has function scope.
How does let differ from var?
let has block scope, meaning it is only accessible within the block it is defined in, whereas var has function scope and is hoisted.
What is block scope in JavaScript?
Block scope means the variable is only accessible within the curly braces {} where it is declared, such as in loops, conditionals, or functions.
Can you redeclare a variable using let in the same scope?
No, variables declared with let cannot be redeclared in the same scope, which prevents accidental overwriting of variables.
What happens if you try to access a let variable before it is declared?
Accessing a let variable before its declaration results in a ReferenceError due to the Temporal Dead Zone (TDZ), where the variable exists but is not yet initialized.
Can let be used in loops?
Yes, let is commonly used in loops for variable declaration, ensuring each iteration has its own scope, avoiding issues with closures in asynchronous code.
