Immutability. Unchangeable. Changeless.
When we learn about programming, one of the first things we learn is how to declare a variable. We, then, learn how to change a value of said variable in different ways. From then on, it's up to us on how we implement our applications.
What about const?
When I want a variable to be impossible to change, I just declare a
const. But hey, there's a problem.
const only works on primary types. String, numbers, booleans work fine with
const. It is when you want to declare an immutable object.. that's when
const will fail you.
In the above code example, we declare an car object with
const. As you can see we can modify this object directly.
car.speedUp value has been changed from a function to a number. So what the hell does
const actually do?
Well, declaring a
const cannot be bound to a different value after declaration. Changing the actual constant of
car to a string value or any value will result in an error. If you're smart, you'd have an IDE that catches this before runtime. Otherwise, you'll just get a nasty message when you run the application.
So what now? How do we declare an immutable object? Use
Object.freeze, of course!
Object.freeze takes an object as a parameter and returns a non-extensible version of object that was passed. New properties cannot be added to the frozen object. Frozen object properties cannot be changed or deleted.
The above code shows a bar object being frozen by
Object.freeze. When we try to change the value of the
a property we get a TypeError.
But there's a problem.
Object.freeze is just a shallow freeze. This method only goes down one level. The last line in the above code is successful in modifying
bar.b.c to the value of 3.
Unfortunately, there isn't a deep freeze method available in
Object. A quick Google search returns a small NPM package called deep-freeze that recursively freezes an object. This package is actually so small, copy/pasting this into one of your "helper" methods in your application is easily doable.
Why? Well, first and foremost, use
Object.freeze whenever you want an object that is unchangeable. When would you want this?
There are many cases where this would be useful. When an object is mutable, there is a chance that the object may have changed unintentionally through side effects from different methods or lines of code.
Object.freeze protects you from modifying an object. A good use case for this is if you make a XHR call to the server and it returns data that should NOT be modified what so ever.
Another good use case is if you're creating a micro-service and want other programmers to have access to this object you've created but don't want them to modify it in any way.
Here's an example:
We create a factory function called Users that returns a frozen object with methods as the object's properties. If you're familiar with other programming languages,
Object.freeze is similar to that of the
final keyword in Java where you're not allowed to modify a
final class what so ever.
With the use of
Object.freeze you can prevent your code from having unintentional side effects. It can allow you to manage state better in your applications with immutability. Use it well.