let. const. var. These are the three different ways to declare JavaScript variables. The how, when, and why to use each of these is what I'll try to cover in this article.
Now before ES2015 (ES6), there was only one way to define variables; using the var
keyword. But with the release of ES6 there were now two more ways of defining variables that is; using the let
and const
keywords.
JavaScript being an un-typed language; a value of any data type can be stored in the variables defined using var
, let
or const
. Therefore what guides you to decide what keyword to use is how you want to use the variables. For example: are you going to change the variable later on in the program, reassign it, or is it going to remain constant, and what scope are you targeting.
1. Var
Syntax: var variableName;
Variables defined this way can also be redeclared and reassigned in the same scope without any errors.
Scope: global and local. The variable could be defined outside functions and can be accessed from any part of the JavaScript code (global), or defined within a function and accessed only within that function (local).
2. Let
Syntax: let firstName;
Reassignment of variables declared using let
is correct but re-declaring of these variables in the same scope throws an error.
Scope: block. That is to mean its access is restricted to the block in which it is defined.
The difference between let and var scope can be as illustrated below:
// block scope
function checkScopeBlock() {
for (let i = 1; i < 3; i++) {
console.log("Block scope ", i);
}
console.log(i); // throws a reference error, i is not defined, since i is outside the for block in which it is defined.
}
checkScopeBlock();
// local (function) scope:
function checkScopeLocal() {
for (var i = 1; i < 3; i++) {
console.log("Local scope ", i);
}
console.log(i); // i=3 local scope; visible from any part within the function even outside the for block in which it defined as a result of hoisting.
}
checkScopeLocal();
Therefore note that variables declared using var
within loops, if blocks and other blocks within a function will be visible at any part of that function, whereas when using let
these variables will only be visible within the specific blocks and hence lowering the chances of logical errors.
Thus, the let
keyword is preferred to var
when declaring variables.
3. const
Syntax: const PI = 22/7; //a constant must be initialized during its declaration.
Variables defined using the const keyword are known as constants. Constants cannot be reassigned values or re-declared. i.e:
//Reassignment
const firstName = "Luciana";
firstName = "Mercy"; //throws an error
console.log(firstName);
//Redeclaration
const lastName = "Luciana";
const lastName = "Mercy"; //throws an error lastName has already been declared
console.log(lastName);
Constants are therefore mainly used when declaring variables to be used as read-only references since constants values cannot be changed.
The scope of constants is block, similar to that of variables declared using let
.
In conclusion, use let
when declaring variables that will change with program execution and use const
when declaring variables to be used as read-only references.
Any comments and additions, would love to hear those.