JavaScript Const

The const keyword in JavaScript is used to create variables that cannot be redeclared or changed after their first assignment. This keeps the variable’s value fixed.

Additionally, const doesn’t allow redeclaration of the same variable within the same block, and it provides block scope. It was introduced in ES2015 (ES6) for creating immutable variables.

Syntax

To declare a variable with const, assign a value immediately upon declaration, as omitting an initializer will lead to a syntax error:

const const_name;
const x;

Characteristics of JavaScript const

Here are some Characteristics of JavaScript Const :

• Cannot be reassigned: Once a value is assigned to a const variable, it cannot be changed.
• Block scope: const is limited to the block in which it is defined, meaning it is not accessible outside of that block.
• Must be assigned during declaration: A const variable must be assigned a value at the time it is declared.
• Works with primitive values: const is often used with primitive values like numbers, strings, or booleans, making them immutable.
• Objects and arrays can be modified: While a const object or array cannot be reassigned to a new reference, the values or properties inside them can be modified.
• Can’t reference new objects or arrays: You can modify the content of const arrays or objects but cannot reassign them to a completely new array or object.
• Can be redeclared in different block scopes: const variables can be declared again in a different block scope without any conflict.
• Cannot be hoisted: Unlike var, const variables are not hoisted and must be declared before use.
• Creates read-only references: const creates a reference to a value that cannot be changed, although properties of objects and arrays may still be altered.

Cannot Be Reassigned

Once a value is assigned to a const variable, it cannot be reassigned. Any attempt to change the value of a const variable will throw an error.

const x = 12;
x = 13;
x += 1;

Output:

Uncaught TypeError: Assignment to constant variable.

Block Scope

Variables declared with const are limited to the block, statement, or expression in which they are defined. They cannot be accessed outside this block.

if (true) {
    const y = 10;
    console.log(y); // 10
}
console.log(y); // Error: y is not defined

Output: 

Uncaught SyntaxError: Uncaught ReferenceError: y is not defined

Variables Must Be Assigned on Declaration

A const variable must be initialized at the time of declaration. Declaring a const variable without assigning a value will result in a syntax error.

const x;
x = 12;

Output: 

Uncaught SyntaxError: Missing initializer in const declaration

Cannot Be Hoisted Like var

const variables are not hoisted in the same way as var. They cannot be used before they are declared, or it will result in an error.

Example:

x = 3;
console.log(x);
const x;

Output: 

Uncaught SyntaxError: Missing initializer in const declaration

Examples of JavaScript Const

Example 1: const in Arrays

While you cannot reassign a new array to a const variable, you can modify the contents of the array, such as adding, removing, or changing elements.

Example:

// Changing the content of array is
// possible in cost array
const arr1 = ["pankaj", "sumit", "chandan", "ajay"];

console.log(arr1.toString());

arr1[2] = "Narayan"; // possible

console.log(arr1.toString());

pankaj,sumit,chandan,ajay
pankaj,sumit,Narayan,ajay

Example 2: const in Objects

Similar to arrays, the properties of an object declared with const can be modified, but the reference to the object cannot be changed.

Example:

const person = {
    first_name: "Pankaj",
    last_name: "Singh",
    Age: 20,
    About: "Web Developer and Competitive Programmer"
};

console.log(person);

// It is possible
person.first_name = "Aryan";
person.last_name = "Yadav";
person.Age = 22;
person.About = "Commerce undergraduate";

console.log(person);

// it is not possible
// const person={
// "first_name":"Aryan",
// "last_name":"Yadav",
// "Age":22,
// "About":"Commerce undergraduate"
// }

{
  first_name: 'Pankaj',
  last_name: 'Singh',
  Age: 20,
  About: 'Web Developer and Competitive Programmer'
}
{
  first_name: 'Aryan',
  last_name: 'Yadav',
  Age: 22,
  About: 'Commerce undergradu...

Limitations of const

While const is powerful for creating stable, immutable references, there are a few limitations:

• No Percentage Units: Only length-based values like px, em, or rem can be used in property settings; percentages are not applicable.
• Incompatibility with Justified Text: const variables cannot be used effectively with justified text as they may introduce uneven spacing.
• Cross-Browser Consistency: Different browsers may show slight differences in rendering, potentially affecting layout

Supported Browsers

• Google Chrome
• Edge 
• Firefox
• Opera
• Safari

P.S: To clear your concept of var, const, and let please go through How to declare variables in different ways in JavaScript?

JavaScript Const – FAQs

What does const mean in JavaScript?

const is a keyword used to declare constants in JavaScript, meaning the variable’s value cannot be reassigned after its initial assignment.

How does const differ from let and var?

Unlike let and var, variables declared with const cannot be reassigned. const also has block scope, similar to let.

What is the scope of variables declared with const?

const variables have block scope, meaning they are only accessible within the block they are defined in, such as within loops, conditionals, or functions.

Can a const variable be redeclared?

No, a variable declared with const cannot be redeclared in the same scope, ensuring its value remains constant within that scope.

Can you mutate objects or arrays declared with const?

Yes, the properties of objects and elements of arrays declared with const can be mutated, but the variable itself cannot be reassigned to a different object or array.

P

Pankaj_Singh

Follow

Improve

Article Tags :

• JavaScript
• Web Technologies
• javascript-basics