How can I create a new Object from a JSON value without changing the parent in JS?

Question

I've been working with JS + JSON, and I can't find a way to make a new object out of a value of some parent object. For example:

const parent = {
  "child": {"value": 12},
  "otherChild": {"value": 83}
}

// I want to create a duplicate without editing the original
const newChild = parent.child;
newChild.value = 25;

// Logs 25
console.log(parent.child.value);

I've tried using new Object(); and it still doesn't work. :/

Answer 1

The easiest way will be:

const parent = {
    "child": {"value": 12},
    "otherChild": {"value": 83}
}

// I want to create a duplicate without editing the original
const newChild = JSON.parse(JSON.stringify(parent.child));
newChild.value = 25;

If you don't need any old browsers \ node version support, you can also easily use:

const newChild = structuredClone(parent)

Both will work with sub objects too.

Answer 2

You can try using a lodash method called cloneDeep

const _ = require('lodash');
   
var obj = {
    x: 23
};
   
// Deep copy
var deepCopy = _.cloneDeep(obj);
   
console.log('Comparing original with'
    + ' deep ', obj === deepCopy);
   
obj.x = 10; // Changing original value
   
console.log('After changing original value');
   
console.log("Original value ", obj);
   
console.log("Deep Copy value ", deepCopy);

However there are also native solutions, check out this answer