JavaScript Let vs Const

This JavaScript post writes about the differences between the usage and context of keywords let versus const in creating JavaScript variables.

Introduction

The two main keywords that we use to create variables are let and const. In the following passages we will detail the differences between the usage of the two keywords and illustrate that with examples.

Using let keyword

Let's consider an example code snippet

let age;
console.log(age); // undefined 

This process of using the let keyword with the variable age followed by a semi colon in this case is referred to as declaration of a variable. Here you will notice that we have not assigned any value to the variable age. Hence the variable age in this case is referred to as undefined. Hence when we check the console we find that the result of code is undefined. A JavaScript variable without any value assigned is called an undefined variable.

Initialization of Variables with let

The process of assigning a value to a variable using the assignment operator (=) is called the Initialization of variable.

let age = 25; // initialization 
console.log(age); //25

In the above code block you can clearly see that the result in the console is 25 since 25 is the value assigned to the age variable in this example.

Reassignment of Values with let

In JavaScript if you use the let keyword you are allowed to re-assign values to a variable that has already been assigned a initial value and the previous value will be replaced by a new value. Reassignment of values could be performed any number of times while using let keyword.

let age = 25;
console.log(age);  //25
age = 30;
console.log(age);   //30

In this example, first a value of 25 is assigned to the age variable and then it is re assigned a value of 30 but while re assigning the value to the age variable with a value of 30, we don't use the let keyword at the time of re assignment but we use let onky once while creating and declaring the age variable.

Using the Const keyword

const maxMarks = 100;
console.log(maxMarks);  //100

By using the const keyword we create and declare the variable maxMarks by assigning it a value of 100. The keyword const is used in cases where the value is a constant and not mutable .If we re assign this variable with a new value then its throwing an error in the console since the const keyword is immutable.

Re-assignment of values and const

Const keyword cannot be used in re assignment of variable values

const maxMarks = 100;
console.log(maxMarks);  //100
maxMarks = 200;
console.log(maxMarks);  // error

In the above example, we observe that on re assignment of a value of 200 to maxMarks, it throws an error message in the console .

Declaration and initialization using const keyword

When we try declaring a variable maxMarks using const keyword without initialization it with a value, it returns an error message in console.

const maxMarks;
console.log(maxMarks);  // error

Hence it is important to note that while using the const keyword, we need to initialize the value of the variable , in order to be able to declare the variable , else, it is not possible to declare the variable without any value assigned to it in the first place at the time of creation, unlike in the case of the let keyword, where, it is possible to declare an undefined variable first and then assign it a value later.

Conclusion

This post is very simple and clear and just written to document the different ways in which the two keywords in JavaScript, namely, let and const behave and perform while declaring and using variables.

If you want to watch in video version, here is the tutorial as provided below.