Let Var and Const in Javascript
Variables are Containers for Storing Data and the variable is the name of the memory location.
A variable is a kind of data storage that has labels. It’s a method for identifying and storing data and values for subsequent program executions. Imagine a container has a name, inside which you can store various items such as words, numbers, or other forms of data. You can declare variables using three keywords: let, var, or const.
Var
- One way to declare variables in JavaScript is with the var keyword.
- Before ES6 var was used to declare variables in JavaScript.
- The var keyword indicates that the variable is to be available only within the function that declared it.
- Because of its peculiarities and possible problems, var is less frequently used in contemporary JavaScript.
var age 25;
console.log("Initial Age:", age); // Output: Initial Age: 25
// Update the variable
if (true) {
var age=30; // This reassigns the variable, even though it's within a block
console.log("Updated Age Inside Block:", age);
}
//Output: Updated Age Inside Block: 30
// Display the updated value outside the block
console.log("Updated Age Outside Block:", age);
// Output: Updated Age Outside Block: 30
Let
- Let keyword is used to declare variables in javascript
- Introduced with ECMAScript 6 (ES6), it provides block scope. Exclusively within the block containing their definition, encased in curly braces, are variables declared using let accessible.
- Because its behavior is more predictable than that of var, let is more commonly used.
Example 1:
let message="Hello"; // Declare a variable using let
message=message+" World"; // updated the variable
console.log(message) // output:Hello World
Example 2:
let age 25;
console.log("Initial Age:", age); // Output: Initial Age: 25
// Update the variable
if (true) {
var let=30; // This creates new variable, because it is in new block
console.log("Updated Age Inside Block:", age);
}
//Output: Updated Age Inside Block: 30
// Display the updated value outside the block
console.log("Updated Age Outside Block:", age);
// Output: Updated Age Outside Block: 25
“Let” has block scope so when we declared “age” using “let” inside “if block”.This will not change the value of “age” outside the block.
Const
- In JavaScript, const is a keyword used to declare variables
- Another new feature in ES6 is the ability to declare variables as constants with the const keyword. These variables should not have their values changed after initialization.
- This is why the const keyword is so useful when you need a variable to have a constant value all through your code.
- Using const not only communicates the immutability of a variable but also helps prevent accidental reassignment, making your code more robust and self-explanatory.
- Like let, const has block scope.
const pi = 3.14;
console.log(pi); // Output: 3.14
// Attempting to reassign a const variable will result in an error
pi = 3.14159; // Error: Assignment to constant variable
Differences between var, let, and const:
Sr No | Var | Let | Const |
1 | The scope of a var variable is functional. | The scope of a let variable is block scope. | The scope of a const variable is block scope. |
2 | It can be updated and re-declared into the scope. | It can be updated but cannot be redeclared into the scope. | It cannot be updated or re-declared into the scope. |
3 | It can be declared without initialization. | It can be declared without initialization. | It cannot be declared without initialization. |
4 | It can be accessed without initialization as its default value is “undefined”. | It cannot be accessed without initialization otherwise it will give ‘referenceError’. | It cannot be accessed without initialization, as it cannot be declared without initialization. |
5 | The variable can be hoisted, with initializing as a ‘default’ value. | The variable can be hoisted, but not initialized (this is the reason for the error when we access the let variable before declaration/initialization) | Variable can be hoisted, but not initialized (this is the reason for the error when we access the const variable before declaration/initialization) |
// Using var
var x = 5;
if (true) {
var x = 10;
console.log("Inside Block (var):", x); // Output: Inside Block (var): 10
}
console.log("Outside Block (var):", x); // Output: Outside Block (var): 10
// Using let
let y=5;
if (true) {
let y= 10;
console.log("Inside Block (let):", y); // Output: Inside Block (let): 10
}
console.log("Outside Block (let):", y); // Output: Outside Block (let): 5
// Using const
const z = 5;
// const z 10; // Uncommenting this line will result in an error
console.log("Const Variable (const):", z); // Output: Const Variable (const): 5