Discussion on: Deep Clone of JS Objects with circular dependency

[Dong Nguyen]

Let's keep it simple. Logic is quite clear: if the input is not object or array, return it. Otherwise, call the function recursively. To avoid circular, just create a history to save each of value it sees at every step. Here is my suggestion (not tested):

const isArray = (val) => {
  return Array.isArray(val);
};

const isObject = (val) => {
  return {}.toString.call(val) === '[object Object]' && !isArray(val);
};

const clone = (val, history = null) => {
  const stack = history || new Set();

  if (stack.has(val)) {
    return val;
  }

  stack.add(val);

  const copyObject = (o) => {
    const oo = Object.create({});
    for (const k in o) {
      oo[k] = clone(o[k], stack);
    }
    return oo;
  };

  const copyArray = (a) => {
    return [...a].map((e) => {
      if (isArray(e)) {
        return copyArray(e);
      } else if (isObject(e)) {
        return copyObject(e);
      }
      return clone(e, stack);
    });
  };

  if (isArray(val)) {
    return copyArray(val);
  }

  if (isObject(val)) {
    return copyObject(val);
  }

  return val;
};

[Saloni Yadav]

Hi Dong, this is a charming solution. It worked beautifully for all the nested objects, arrays, and primitive.

However, I tested a couple of scenarios for the cyclic object. And I found a behavior which is quite interesting. I hope to figure this out together-

//original object
let original = {
    a: 1, 
    b: [1, 2],
    c: [1, [2, 3]],
    d: {
        d1: 1,
        d2: [1, 2],
        d3: {}
    }
};

original.d.d3 = original.d;

let deep = clone(original);
//after which I did the following modifications
deep.d.d1 = 'saloni';
deep.d.d3.d1 = 'yadav';

Observations:

1. The first hierarchy of circular object is deep cloned
2. From the second hierarchy onwards, the cloning is shallow, both the current object and the original object.

Required:

1. The circular dependency should be shallow within the same object, so even when I change the first parent in the deep obj, all the corresponding children should point to the same obj.
2. This should however, not effect the original object at all.

This is scenario is obviously a very complex version of our use case. And I think the solution lies in how we use the Set or the Map. However, I must mention that your solution works amazingly well for a non-circular n-depth object. So kudos and thank you for that!! 🤩

[Dong Nguyen]

my pleasure! Thank you for your compliments.
Shallowing is a big issue here because we need a deepClone method. Please try to fix it :)
In another reply you mentioned to lodash. I've taken a look on their solution:
github.com/lodash/lodash/blob/mast...
The problem seems to be more complicated than we think, so they need a lot of code to deal with.

[Saloni Yadav]

Hey, thanks for sharing the source code. It is pretty huge with a lot of cases for various scenarios. Indeed looks like its way more twisted than a recursive call. Pretty interesting all the same!