How to use Json.parse() and Json.stringify() to Deep clone In Javascript
This method leverages the built-in JSON serialization and deserialization functions. It works well for most cases, but there are limitations:
- It loses non-JSON-safe data types (e.g., functions,
undefined
,Infinity
, and circular references). - Dates are converted to strings during serialization.
Example: In this example, we are using Json.parse and Json.stringify.
Javascript
let student1 = { name: "Manish" , company: "Gfg" } let student2 = JSON.parse(JSON.stringify(student1)) student1.name = "Rakesh" console.log( "student 1 name is" , student1.name) console.log( "student 2 name is " , student2.name); |
student 1 name is Rakesh student 2 name is Manish
Note: Both Object.assign() and the spread operator (…) will create shallow copy while dealing with nested objects or arrays, they only clone the immediate level of properties.
We can use all of these approaches to make sure that the data is safe and doesn’t get mutate when we change in one object.
How to Deep clone in JavaScript ?
In general, cloning means copying one value to another. In JavaScript, we do cloning i.e. copying one value to another using JavaScript. To be more precise there are two types of cloning in JavaScript. As a programmer, it might be a beginner or veteran he/she should be able to know the differences between Deep clone and shallow clone. As this article is about Deep clones we will study detail about Deep clones.