In this shot, we will go over some basic notions about var
, let
, and const
, the keywords you use almost every day when coding software in JavaScript.
Let’s get started.
Do you remember what we use to help us catch and hold values? We use these three words for that purpose, but they don’t all mean the same thing.
var
: Short for “variable.” This is the old-fashioned way we used in pre-2015 JavaScript.const
: Short for “constant.” This is the modern way to create bindings.let
: This is another modern way.var name = "Sarah";const greeting = "Hello";console.log(greeting + " " + name);// Hello Sarahlet age = 1;console.log("You're " + age);// You're 1
var
has global scopeAs a reminder, the visibility and lifetime of a given variable is determined by its scope. As such, a variable is not visible/accessible outside the scope in which it is declared.
A variable has global scope if it is declared outside a function, block… scope. It can be accessed from anywhere in your program.
userScore = 4;
var userScore;
Function-scope means that you cannot access them outside the function.
Let’s try to access var
out of the doSomething()
function.
function doSomething() {var someVar = "Something";}console.log(someVar)
When you run this code, you’ll get a ReferenceError
saying that x is not defined
.
You’ll get the same thing if you try to replace var
with let
or const
.
const
and let
are block-scopeThe block scope is defined with curly braces ({}
).
function listFruits () {if(true) {const fruit1 = "orange"; //it exists in block scopelet fruit2 = "avocado"; //it exists in block scopevar fruit3 = "banana"; // it exists in function scope}//console.log(fruit1);//console.log(fruit2);console.log(fruit3);}listFruits();
As you can see in the code above, only fruit3
is accessed, because var
does not have block scope. Try uncommenting lines 8 and 9, and you will get a ReferenceError
.
let
and var
can be reassigned, but const
cannotconst
is still unique as long as the program lives. var
and let
can be reassigned as much as needed.
var name = "Sarah";const greeting = "Hello ";console.log(greeting + name);// if we try to set the greeting again, we get an error//greeting = "Hi";name = "Patience";console.log(greeting + name)let age = 1;console.log("You're " + age);age = 5; // we reset the age but no errorconsole.log("You're " + age);
Try uncommenting line 7. You will get a SyntaxError
because the const greeting
is read-only once it is declared.
There are three different ways to declare a variable in JavaScript. You can use var
, let
, or const
. They don’t all necessarily mean the same thing. While they are all function scope variables, var
is a global scope variable and let
and const
are block scope ones. It is possible to reassign let
and var
, but not const
.
As a rule of thumb, always use const
to declare your variables unless they are likely to change in the runtime of your program, in which case you can use let
. You should avoid the var
keyword as much as possible for variable declaration.