codedamn logo
codedamn

What is const in JavaScript – Complete guide

  • Vishnupriya's profile image
    Vishnupriya
    Team codedamn
What is const in JavaScript – Complete guide

Hey readers, in this article we will understand the const keyword in JavaScript, in-depth.

Introduction

In Javascript, a variable created using the ‘let‘ or ‘varkeyword can be re-assigned a value indefinitely. This means that once a variable is declared using the said keywords, it can be assigned a different/same value using the ‘=’ operator, any number of times. This is all well and good but it becomes problematic when there are faulty reassignments. There are cases where variables are used as constants and so their values shall not change at all. A faulty or buggy re-assignment of these variables can disrupt the whole code. But Javascript saves the day using the ‘const‘ keyword. Let’s see how.

Const keyword in JavaScript

The const keyword was introduced in JavaScript ES6 and is used to create new variables. A JavaScript variable is normally declared using the ‘var’ or the ‘let’ keywords. These variables, as discussed are welcome to value re-assignments. But, to create a variable with a constant value, the keyword ‘const’ is used in place of ‘var’ or ‘let’.

A variable created using the ‘const’ keyword won’t welcome any re-assignment(s). And in-turn it will throw an error if it is tried to be re-assigned with a new value. Unlike ‘let’ and ‘var’, a const variable should strictly be declared and defined in the same single code statement. To be clear on this, the declaration is the process of assigning a memory block to a variable. And initialisation involves filling that memory block with a value. This value can be anything from a string or number or boolean to a function definition.

Further, a const variable is scoped to a block. This means that a const variable can only be accessed in the block it is declared in, in the program. The scope of a const variable is exactly the same as that of a ‘let’ variable. Similarly, const variables’ hoisting is the same as let variable hoisting. So, apart from the re-assignment part, there is no difference between a ‘let’ variable and a ‘const’ variable.

Let’s see an example:

<script type="text/javascript">
const x = 22;
{
const x = 90;
console.log(x);
{
const x = 77;
console.log(x);
}
{
const x = 45;
console.log(x);
}
}
console.log(x);
</script>

In the above example, note that there are three blocks in the script tag. Now, similar to a ‘let’ variable, a ‘const’ variable is accessible only in the block it is declared and initialised in. So, the output of the above code will be as follows:
90
77
45
22

Const Immutability

Now, it’s clear that a const variable can not be re-assigned with a value. But this doesn’t really make it completely immutable.
If the ‘const’ variable holds a string or numeric or boolean or a null value, it is perfectly immutable. It can not be assigned a new value and its existing value is also unmodifiable.
But if the ‘const’ variable holds an object, the object data can surely be modified. Note that the object is actually a reference and it actually refers to its data. So, the data inside the object can be modified even when the object is created using const. But, the object itself can not change i.e. the ‘const’ variable can not point to a different object. And this object can not be renamed as well.

Conclusion

This was about the const keyword in JavaSript. If you have any doubts regarding the above code output or otherwise, feel free to comment down with your query. And if you want to learn more about Javascript, do check out the related articles and courses on Codedamn.

Further, if you’re interested in studying JavaScript, Codedamn offers interactive courses with an in-browser sandbox environment. Here you can learn and practice code, all in a browser window. Codedamn also provides programming and development articles like this one. You can sign up for our newsletter to be informed about new programs and upgrades. Feel free to ask any questions or leave your feedback in the comments section.

Related BlogData types in Javascript

User avatar