const PI = 3.141592653589793;
PI = 3.14; // This will give an error
PI = PI + 10; // This will also give an error
var x = 10;
// Here x is 10
{
const x = 2;
// Here x is 2
}
// Here x is 10
You can learn more about Block Scope in the previous chapter: JavaScript Let.
Assigned when Declared #
JavaScript const
variables must be assigned a value when they are declared:
Incorrect #
const PI;
PI = 3.14159265359;
Correct #
const PI = 3.14159265359;
Not Real Constants #
The keyword
const
is a little misleading.It does NOT define a constant value. It defines a constant reference to a value.
Because of this, we cannot change constant primitive values, but we can change the properties of constant objects.
Primitive Values #
If we assign a primitive value to a constant, we cannot change the primitive value:
Example #
const PI = 3.141592653589793;
PI = 3.14; // This will give an error
PI = PI + 10; // This will also give an error
// You can create a const object:
const car = {type:"Fiat", model:"500", color:"white"};
// You can change a property:
car.color = "red";
// You can add a property:
car.owner = "Johnson";
But you can NOT reassign a constant object:
Example #
const car = {type:"Fiat", model:"500", color:"white"};
car = {type:"Volvo", model:"EX60", color:"red"}; // ERROR
// You can create a constant array:
const cars = ["Saab", "Volvo", "BMW"];
// You can change an element:
cars[0] = "Toyota";
// You can add an element:
cars.push("Audi");
But you can NOT reassign a constant array:
Example #
const cars = ["Saab", "Volvo", "BMW"];
cars = ["Toyota", "Volvo", "Audi"]; // ERROR
Browser Support #
The const
keyword is not supported in Internet Explorer 10 or earlier.
The following table defines the first browser versions with full support for the const
keyword:
Chrome 49 | IE / Edge 11 | Firefox 36 | Safari 10 | Opera 36 |
Mar, 2016 | Oct, 2013 | Feb, 2015 | Sep, 2016 | Mar, 2016 |
Redeclaring #
Redeclaring a JavaScript var
variable is allowed anywhere in a program:
Example #
var x = 2; // Allowed
var x = 3; // Allowed
x = 4; // Allowed
Redeclaring or reassigning an existing var
or let
variable to const
, in the same scope, or in the same block, is not allowed:
Example #
var x = 2; // Allowed
const x = 2; // Not allowed
{
let x = 2; // Allowed
const x = 2; // Not allowed
}
Redeclaring or reassigning an existing const
variable, in the same scope, or in the same block, is not allowed:
Example #
const x = 2; // Allowed
const x = 3; // Not allowed
x = 3; // Not allowed
var x = 3; // Not allowed
let x = 3; // Not allowed
{
const x = 2; // Allowed
const x = 3; // Not allowed
x = 3; // Not allowed
var x = 3; // Not allowed
let x = 3; // Not allowed
}
Redeclaring a variable with const
, in another scope, or in another block, is allowed:
Example #
const x = 2; // Allowed
{
const x = 3; // Allowed
}
{
const x = 4; // Allowed
}
Hoisting #
Variables defined with var
are hoisted to the top and can be initialized at any time (if you don’t know what Hoisting is, read our Hoisting Chapter).
Meaning: You can use the variable before it is declared:
Example #
This is OK:
carName = "Volvo";
alert(carName);
var carName;
Variables defined with const
are hoisted to the top of the block, but not initialized.
Meaning: The block of code is aware of the variable, but it cannot be used until it has been declared.
The variable is in a “temporal dead zone” from the start of the block until it is declared.
Using a const
variable before it is declared, is a syntax errror, so the code will simply not run.
Example #
This code will not run:
carName = "Volvo";
const carName;