Up until this point, I only used the keyword let
to declare a variable; however, there are also const
and var
. Let's now take a look at the three different ways of declaring variables in javascript.
To be precise let
and const
are introduced in ES6(ES2015), so they are part of modern javascript, while the keyword var
is the old way of declaring variables. So let's learn how they are different and which one to use in which situations.
let
We use the keyword let
to declare variables that can change later; basically, these variables change their values during the execution of our programme.
let javascriptIsFun = true;
console.log(javascriptIsFun); // true
javascriptIsFun = 'Yes it is';
console.log(javascriptIsFun); // Yes it is
javascriptIsFun
is changing during the execution of our programme.As the variable's value javascriptIsFun
changes from boolean true
to string Yes it is
, we should prefer to use the keyword let
to declare such a variable. So, it's perfectly okay to declare a variable let
at one point in the programme and then later assign a new value.
In technical terms, we call this reassigning value to a variable, or also we can say that we mutate the javascriptIsFun
variable; in the above example. You will hear the term mutate a lot in the javascript world.
So, when we need to mutate a variable, that's the perfect use case for using let
and that also counts for the possibility that we want to declare empty variables.
// intially we declare an empty variable
let year;
console.log(year); // undefined
// now we can mutate the value
year = 2021;
console.log(year); // 2021
year
that will mutate to 2021
later in the programme.Sometimes, we want to declare all the variables at the top of a file but only assign actual values to the variable later in the programme, for example, based on some condition.
let x, y, total;
console.log(x, y, total) // undefined undefined undefined
x = 20;
y = 30;
console.log(x, y, total) // 20 30 undefined
total = x+y;
console.log(x, y, total); // 20 30 50
x = 40;
y = 50;
total = x+y;
console.log(x, y, total); // 40 50 90
x
, y
, total
are having more than one value in single code execution.const
We just discussed that let
is used when we need a mutating variable. On the other hand, we use the keyword const
to declare variables that are not supposed to change at a point in the future during a single execution. So the value in a const
variable cannot be changed.
Now the fact that variables created with const
are immutable implicitly means that we cannot declare empty
const
variable.
// With const we cannot have empty variable
const birthYear; // This is illegal
const
variables with some value.// With const initialise a value while declaring
const birthYear = 1996;
const
we should always initialise a value while declaringconst birthYear = 1996;
console.log(birthYear); // 1996
// We cannot reassign, if we declared our variable using const
// Variables of const are immutable
birthYear = 1995; // Will result in an error
let
.In technical terms, we use the keyword const
to create immutable
variables. A variable that cannot be mutated. The birth year is a perfect example of that because the birth year can never change. While the age, of course, can change.
const birthYear = 1996
let age, currentYear;
currentYear = 2021;
age = currentYear - BirthYear;
console.log(age) // 25
currentYear = 2022
age = currentYear - BirthYear;
console.log(age); // 26
age
and currentYear
might change but not the birthYear
. So according to our needs, we use let
or const
. Also, remember in the above example, in place of const birthYear = 1996
, I can also achieve the same results by using let birthYear = 1996
. But using const
for immutable
the variable is considered a good coding practice.
const or let?
Now with these two different ways of declaring variables, you will probably ask should I use let
or const
to declare a new variable?
Well, as a best practice for writing clean code, I will always recommend using const
by default and use let
only when you are sure that the variable needs to change at some point in the future. This is to have as few variable mutations as possible; because mutable variables introduce a potential to create bugs.
So, by default always prefer to use const.
var
Now there is also a third way of declaring variables in javascript, which is the keyword var
. But this one should be avoided entirely. However, we should still know how it works for legacy reasons. Maybe you will come across this on an older code basis or some older coding tutorials.
var
is basically an old way of defining variables prior to ES6. And at first sight, it works pretty much the same as the let
.
var job = 'Programmer';
console.log(job); // Programmer
// Reassigning is posisble with var
job = 'Teacher';
console.log(job); // Teacher
let
you can mutate the value of the variable.Although it looks like var
and let
are similar. Below the surface, they're actually pretty different. And also, there are many differences between let
, const
, and var
; you will learn all about these differences later in the DOM manipulation and Events section.
You might hear me saying this a lot because programming is not linear learning, you will eventually get it. Sometimes the basic understanding is good enough to move forward. So, it would really be not useful for you to know that let
is block scoped
and var
is function scoped
; because you don't even know what a block or what a function really is. We will learn about these eventually so stick with me, I'm sure that I can guide you on the right path. For now, what matters is that you should never use var
.