ES6 has brought several new features and methods into JavaScript since its release. Amongst these new features are Object.freeze() method and const. Sometimes people get confused between Object.freeze() method and const but the Object.freeze() and const are completely different. In this article we will explain the differences between these two.
JavaScript const: The const keyword creates a read-only reference to a value. Variables created by the const keyword are immutable. In other words, you can’t reassign them to different values. Trying to reassign a constant variable will result in a TypeError.
Syntax:
const const_name; const x;
Example 1:
Javascript
let myName = "Geeksforneveropen"console.log(myName) // Uncaught TypeError myName = "gfg" |
Output:
Geeksforneveropen
The const keyword ensures that the variable created is read-only. But It doesn’t mean that the actual value to which the const variable reference is immutable. Even though the person variable is constant. However, you can change the value of its property. But you cannot reassign a different value to the person constant.
Example 2:
Javascript
const person = { name: "Geeksforneveropen"}; // No TypeError person.name = "gfg"; console.log(person.name); |
Output:
gfg
Object.freeze() method: If you want the value of the person object to be immutable, you have to freeze it by using the Object.freeze() method.
Syntax:
Object.freeze(obj)
Example 1:
Javascript
const person = Object.freeze({name: "Geeksforneveropen"}); // TypeError in strict mode //in non-strict mode it prints "Geeksforneveropen" person.name = "gfg"; console.log(person.name) |
Output:
Geeksforneveropen
The Object.freeze() method is shallow, meaning that it can freeze the properties of the object, not the objects referenced by the properties.
Example 2:
Javascript
const person = Object.freeze({ name: 'Geeksforneveropen', address: { city:"Noida" } }); person.address.country = "India"console.log(person.address.country) |
But the person.address object is not immutable, you can add a new property to the person.address object as follows:
// No TypeError person.address.country = "India";
Output:
India
Conclusion:
- const prevents reassignment.
- Object.freeze() prevents mutability.
|
Object.freeze() |
const |
|
|---|---|---|
| 1. | Object freeze() method helps in preventing existing properties from being changed | const is a keyword that was introduced in ES6 (2015). |
| 2. |
Its syntax is -: Object.freeze(object) |
It is helpful if we want some variable not to be declared twice. |
| 3. | It takes one parameter as an Object. |
For example -: const a = 10; |
| 4. | Its return value is an object. | If we define a variable with const then it cannot be reassigned. |
| 5. | It also helps in preventing the new properties to be added to the specific object. | If we define a variable with const then its scope is blocked. |
