What are the differences between var, let and const in JavaScript?
JavaScript has three variable declaration statements: var, let and const. The latter two were added in ES6, whereas var existed since previous versions. One of the first things to notice is that const defines constants (i.e. values that will not be reassigned), whereas var and let define variables. Yet, var behaves differently from both let and const in various other ways.
As I'm revising this article in May 2024, the glory days of var are long gone. Nowadays using var is considered a code smell and should generally be avoided. If you're working on a legacy project that uses var, consider refactoring it to use let or const instead.
Scope
Variables declared with var are function scoped, in contrast to variables declared with let or const which are block scoped.
const scopeExample = () => {
var a = 'var';
let b = 'let';
console.log(a, b); // 'var', 'let'
{
var c = 'var';
let d = 'let';
console.log(c, d); // 'var', 'let'
}
console.log(c); // 'var'
console.log(d); // Throws a ReferenceError
};
If you want to learn more, you can read the article covering JavaScript variables and scopes in more depth.
Hoisting
While variables declared with var are hoisted to the enclosing scope, variables declared with let or const are not initialized until their definition is evaluated.
const hoistingExample = () => {
console.log(a); // undefined
var a = 'var';
console.log(a); // 'var'
console.log(b); // ReferenceError
let b = 'let';
console.log(b); // 'let'
};
If you want to learn more, you can read the article covering JavaScript hoisting in more depth.
Global object property
At the top level, variables declared with var, unlike ones declared with let or const, create a property on the global object.
var a = 'var';
let b = 'let';
console.log(window.a); // 'var'
console.log(window.b); // undefined
Redeclaration
In strict mode, variables declared with var can be re-declared in the same scope, whereas this is not allowed for variables declared with let or const.
'use strict';
var a = 'var1';
var a = 'var2';
let b = 'let1';
let b = 'let2'; // SyntaxError
If you want to learn more, you can read the article covering JavaScript's strict mode in more depth.