Object.freeze() JavaScript

Syntax of Object.freeze() in JavaScript

The syntax of object.freeze() in JavaScript is:

freeze() is a static method in JavaScript which is why we have to call it using the Object class name as Object.freeze().

Parameters of Object.freeze() in JavaScript

The Object.freeze() method has only one parameter:

• my_object: It is the object that we want to freeze. Hence, It is of object data type.

Return Value of Object.freeze() in JavaScript

Return Type: object

The return value of Object.freeze() in JavaScript is the same frozen object. Remember that object freeze JavaScript method does not create a new copy for freezing, it freezes the original object itself.

Example

Code:

Output:

Explanation: In the above-given example, we froze the object myObj; hence when we tried to change the values of its properties like device and color, it failed silently, and the values remained unchanged. But if we do the same in the strict mode, we get a TypeError. Let us execute this example in strict mode.

Same Example in strict mode

The following example is the same as above, except we are using strict mode this time.

Code:

Output:

Explanation:

In the above-given example, we used the strict mode. That is why, when we tried to change the immediate properties of the frozen object myObj, we got a TypeError.

What is Object.freeze() in JavaScript?

The Object.freeze() is an built-in method in JavaScript used for freezing Objects. Here freezing means preventing an object from getting modified. When we freeze an object, its properties get frozen, which means they no longer support modifications. Certain operations can not be performed over a frozen object, such as:

• No new properties can be added to the frozen object.
• No existing properties can be removed from the frozen object.
• No existing properties can be changed or modified in the frozen object.
• No modifications to the prototype of the object can be made.

We will see some examples of the above-mentioned points in the "More Examples" section of this article.

Comparison of Object.freeze() and Object.seal()

The Object.seal() is another method that is used for similar purposes as Object.freeze(). While both of these methods prevent adding new properties to the specific object, the difference lies in how they treat existing properties of the object, that is the existing properties of the sealed object can be changed/modified, but of a frozen object can not be.

Example

Code:

Output:

Explanation:

In the above-given example, we have sealed the object myCar using the Object.seal() method. While we were successful in changing the value of the existing property color from 'blue' to 'grey', we failed to add a new property modelYear to the sealed object.

Hence, it can be concluded that we can change the values of the existing properties of the sealed object but can not add new properties to it. In contrast to this, we can neither change the value of existing properties of the object frozen with Object.freeze() nor add the new properties to it.

More Examples

Let us see some more examples of object freeze JavaScript. Here we will see the examples of freezing objects, freezing arrays, and other examples of object freeze JavaScript.

1. Freezing objects

Let us see another example of Object freeze in JavaScript.

Example:

Code:

Output:

Explanation:

In the above-given example, we have an object called myLaptop which we froze using the Object.freeze() method. As the object got frozen, changing the existing values of the properties got failed silently without giving any error, which means that the program will be further executed. Adding new values also failed silently. But when we tried to change the prototype of Object, we got a TypeError which stopped the program execution hence the console.log(myLaptop) statement after that didn't get executed.

2. Freezing arrays

As we know that Arrays are also objects in JavaScript, hence the Object.freeze() method can also be applied to Arrays. This simply means that we can freeze Arrays too.

Example:

Code:

Output:

Explanation:

In the above-given example, we have an Array called myArr which we froze using the Object.freeze() method. As Arrays are also Objects in JavaScript, they are treated the same as Objects. As Array got frozen, changing the existing values of the properties got failed silently without giving any error. Adding new values also failed but with a TypeError. The prototype has also remained unchanged as it is a frozen Array.

What is Shallow Freeze?

It is worth noting that the object freeze JavaScript method only freezes the immediate properties of the object. Immediate properties, as the name suggests, are the direct child of the object. In addition to this, if an object's immediate property is also an object, then it(the child object) does not get frozen on freezing the parent object. This means that modifications can still be made to that child's object. This phenomenon is called "Shallow Freeze". Here the word shallow freeze means freezing the first layer of the object (or not going deep), which consists of immediate children.

Example

Code:

Output:

Explanation:

In the above-given example, we have an object called myCar, which has three properties in which the third property is the object itself. We know that when we freeze the object, its immediate children get frozen, but this does not apply if the immediate child is an object. Hence when we froze the object myCar, its first two properties got frozen while the third property, that is, the specifications object, remained unfrozen.

That is why, when we tried to change the name property, it failed silently as it was frozen, but when we tried to change the mileage property of the child object specifications, it successfully changed to 18 as the child object specifications is not frozen at all.

See Also

• JavaScript Arrays
• Boolean Expressions in JavaScript