In JavaScript, understanding the concepts of mutability and immutability is crucial for managing and predicting how data changes in your programs. These concepts help define how and when data can be altered.

Mutability vs. Immutability

• Mutable objects are those whose state or content can be changed after they are created.
• Immutable objects are those whose state or content cannot be changed once they are created.

I. Strings and Numbers

In JavaScript, strings and numbers are immutable. This means that once a string or number is created, it cannot be changed.

A. Strings

When you manipulate a string, what you’re actually doing is creating a new string with the changes, rather than altering the original string.

let greeting = "Hello";
greeting = greeting + ", World!"; // Creates a new string, doesn't alter the original
console.log(greeting); // "Hello, World!"

B. Numbers

Similar to strings, numbers are also immutable. Any operation on a number results in a new number being created.

let score = 10;
score = score + 5; // A new number is created
console.log(score); // 15

II. Objects (Including Arrays and Functions)

Objects, on the other hand, are mutable. This means you can change their properties or contents after they’ve been created without creating a new object.

let user = { name: "John" };
user.name = "Jane"; // Mutates the object, doesn't create a new one
console.log(user.name); // "Jane"

Arrays and functions, being types of objects, are also mutable.

let numbers = [1, 2, 3];
numbers.push(4); // Mutates the array
console.log(numbers); // [1, 2, 3, 4]

How const Affects Mutability

The const keyword in JavaScript declares a variable as constant, meaning its reference cannot be changed. However, it’s important to note that const affects variable assignment, not the mutability of the value it holds.

I. Immutable Data Types

Using const with strings or numbers effectively makes the value immutable in practice since you can’t reassign the const variable, and the value it holds can’t be changed.

const pi = 3.14159;
// pi = 3.14; // TypeError: Assignment to constant variable.

II. Mutable Data Types

For objects, arrays, and functions, const prevents reassignment of the variable but does not make the object itself immutable.

const user = { name: "John" };
user.name = "Jane"; // This is allowed
// user = { name: "Dave" }; // TypeError: Assignment to constant variable.

When to Use const

Given its characteristics, const is best used when you want to ensure that a variable name is not reassigned. For immutable data types (strings, numbers), const reinforces their immutability.

For mutable data types (objects, arrays), it ensures the reference to the object doesn’t change, although the object itself can still be modified. To make an object truly immutable, you would need to use methods like Object.freeze().

Conclusion

In JavaScript, understanding the mutability of different data types and how const influences variable assignment is key to writing predictable and bug-free code. While const can help enforce immutability for primitive values, remember that objects, arrays, and functions remain mutable, allowing for changes to their contents or properties.