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.
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, we have an article covering JavaScript variables and scopes in more depth.
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, we have an article covering JavaScript hoisting in more depth.
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
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, we have an article covering JavaScript’s strict mode in more depth.