IMMUTABILITY IN JAVASCRIPT: 3 METHODS

Immutability means something cannot be changed. You might want this to make sure you’re preserving a value.

For example, if you’re having multiple functions input the same value, but the value can potentially change between the function’s operations, you’ll want to ensure the original value isn’t accidentally getting overwritten somewhere in the process.

Here are three ways you can ensure immutability.

CONST

Most of the time, this is the start and end of immutability. It’s lesson one for anyone learning ES6 JavaScript and onward.

Using `const` lets you assign immutable primitive values. Declare a string, number, or boolean variable with `const` and it will never change.

This is not the case with object literals. Using const for an object will still allow you to add or change keys and values within the object.

Use `const` with primitive values for immutability. You’ll need something else for objects. Arrow functions declared with `const` are also immutable. Declaring an arrow function with `let` allows it to be entirely overwritten.

OBJECT.FREEZE()

Object.freeze() does what it sounds like—freezes an object literal and makes it truly immutable. Here’s an example:

Attempting to reassign a value in a frozen object

Attempting to add a key-value pair to a frozen object

Once an object is frozen, it will not change. When you absolutely need an object literal to remain exactly how it is, use `Object.freeze()`.

This also works on arrays in JavaScript.

You might be thinking “everything is an object in JavaScript, including primitives. So does that mean it works on all? Sadly, no. For example, if you try to freeze a string set with normal `var` declaration, it won’t affect mutability at all.

OBJECT.DEFINEPROPERTY()

Using `Object.defineProperty()`, you can determine mutability on a specific property within an object. While the rest of the values within the object are as mutable as ever, you can “lock” an object in.

We tried to rewrite the value of `yourMom.two` to `4` but couldn’t change it because that pair was no longer writable.

The great thing about this kind of immutability is it’s not permanent. Yes, okay, maybe that doesn’t truly make it immutable. Nevertheless, it warrants being mentioned on this list.

Making it writable again is the exact same process as before:

After changing the pair’s `writable` status to `true`, it could again be manipulated as usual.

BONUS: PRIVATE KEYWORDS

Okay, this isn’t a proper feature of JavaScript. It’s been proposed but is not widely supported with JS engines. But it’s still interesting, so I’ll mention it. As a treat.

Using `#` at the beginning of a named variable to make it the equivalent to the `private` keyword in Java classes.

E.g. `#variableName` for a value or function declaration would only make that function accessible inside the class it’s declared.

This doesn’t mean the field is legitimately immutable. It’s only immutable in the sense that you won’t be able to change or even access it outside of the class, even though you normally would be able to normally.

This isn’t truly immutable, but it’s still a neat trick to make a field a bit less mutable. If you need to change or access a private field, that’s when you reach back into OOP-land and rediscover getters and setters.

Deeter Cesler