Declaring a Variable in Javascript

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

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

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

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

// With const initialise a value while declaring
const birthYear = 1996; 

const 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

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

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

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 .