TypeError: Assignment to Constant Variable in JavaScript

Borislav Hadzhiev

3 min


# TypeError: Assignment to Constant Variable in JavaScript

The "Assignment to constant variable" error occurs when trying to reassign or redeclare a variable declared using the const keyword.

When a variable is declared using const, it cannot be reassigned or redeclared.

assignment to constant variable

Here is an example of how the error occurs.

const a = 'bobby'; // โ›”๏ธ TypeError: Assignment to constant variable. a = 'hadz';

# Declare the variable using let instead of const

To solve the "TypeError: Assignment to constant variable" error, declare the variable using the let keyword instead of using const.

Variables declared using the let keyword can be reassigned.

// ๐Ÿ‘‡๏ธ using `let` let a = 'bobby'; a = 'hadz'; console.log(a); // ๐Ÿ‘‰๏ธ "hadz"

We used the let keyword to declare the variable in the example.

Variables declared using let can be reassigned, as opposed to variables declared using const.

You can also use the var keyword in a similar way. However, using var in newer projects is discouraged.

// ๐Ÿ‘‡๏ธ using `var` var a = 'bobby'; a = 'hadz'; console.log(a); // ๐Ÿ‘‰๏ธ hadz

# Pick a different name for the variable

Alternatively, you can declare a new variable using the const keyword and use a different name.

const a = 'bobby'; const b = a + ' hadz'; console.log(b); // ๐Ÿ‘‰๏ธ "bobby hadz"

We declared a variable with a different name to resolve the issue.

The two variables no longer clash, so the "assignment to constant" variable error is no longer raised.

# Declaring a const variable with the same name in a different scope

You can also declare a const variable with the same name in a different scope, e.g. in a function or an if block.

const a = 'bobbyhadz.com'; if (true) { const a = 100; console.log(a); // ๐Ÿ‘‰๏ธ 100 } function example() { const a = [1, 2, 3]; console.log(a); // ๐Ÿ‘‰๏ธ [1, 2, 3] } example(); console.log(a); // ๐Ÿ‘‰๏ธ hello

The if statement and the function have different scopes, so we can declare a variable with the same name in all 3 scopes.

However, this prevents us from accessing the variable from the outer scope.

This can be confusing and is considered a bad practice. It's best to avoid declaring variables with the same name in different scopes.

# The const keyword doesn't make objects immutable

Note that the const keyword prevents us from reassigning or redeclaring a variable, but it doesn't make objects or arrays immutable.

const obj = { name: 'Bobby', }; // โœ… Works obj.name = 'Alice'; console.log(obj); // ๐Ÿ‘‰๏ธ {name: 'Alice'} // โ›”๏ธ Error: Assignment to constant variable. obj = {name: 'Tom'};

We declared an obj variable using the const keyword. The variable stores an object.

Notice that we are able to directly change the value of the name property even though the variable was declared using const.

We can't reassign the variable to a new value, however, we can change the object's values directly.

The behavior is the same when working with arrays.

const arr = ['Bobby']; // โœ… Works arr[0] = 'Hadz'; console.log(arr); // ๐Ÿ‘‰๏ธ ["Hadz"]

Even though we declared the arr variable using the const keyword, we are able to directly change the values of the array elements.

The const keyword prevents us from reassigning the variable, but it doesn't make objects and arrays immutable.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.
book cover
You can use the search field on my Home Page to filter through all of my articles.

Copyright ยฉ 2023 Borislav Hadzhiev