Five things to know about var, let, and const in JavaScript
var, let, and const, the keywords you use almost every day when coding software in JavaScript.
Let’s get started.
1. They are all used to create bindings also known as variables
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
2. Only var has global scope
As 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;
3. They are all function-scope
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.
4. Only const and let are block-scope
The 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.
5. let and var can be reassigned, but const cannot
const 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.
Conclusion
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.
Free Resources
- undefined by undefined
