Approach 2 Using JSON.parse() and JSON.stringify()
The approach involves converting the object to a JSON string using JSON.stringify(), then parsing it back into a new object using JSON.parse(). This creates a deep-frozen object, making it immutable.
Example: The example showcases deep-freezing an object using JSON.parse() and JSON.stringify(),To deep-freeze the object, we first convert it to a JSON string using JSON.stringify(), and then parse it back into a new object using JSON.parse(). This creates a new object with the same structure as the original, but it is a completely independent copy and is now deep-frozen,After deep-freezing, any attempts to modify the properties of deepFrozenObj won’t have any effect because it is now immutable.
const obj1 = { key1: "val1", key2: "val2", key3: "val3" };
console.log("Before Change");
console.log(obj1);
// Create a deep copy of obj1 with a reviver function
const deepFrozenObj = JSON.parse(JSON.stringify(obj1), (k, v) => Object.freeze(v));
// Attempting to modify properties of deepFrozenObj
deepFrozenObj.key1 = "val"; // This won't modify deepFrozenObj
deepFrozenObj.key2 = "newVal"; // This won't modify deepFrozenObj
console.log("After Change");
console.log(deepFrozenObj);
Output
Before Change { key1: 'val1', key2: 'val2', key3: 'val3' } After Change { key1: 'val1', key2: 'val2', key3: 'val3' }
How to deep-freeze an object in JavaScript ?
In this article, we will see what is the problem with objects in JavaScript and why we need to “deep-freeze” an object in JavaScript. We will also learn how to “deep-freeze” an object in JavaScript.