TypeError: Assignment to Constant Variable in JavaScript

# 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.

Here is an example of how the error occurs.

Copied!
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.

Copied!
// 👇️ 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.

Copied!
// 👇️ 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.

Copied!
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.

Copied!
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.

# 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.

Copied!
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.

The behavior is the same when working with arrays.

Copied!
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:

• SyntaxError: Unterminated string constant in JavaScript
• TypeError (intermediate value)(...) is not a function in JS