从现有的javascript中克隆一个新对象答案

【问题标题】：cloning a new object from existing in javascript从现有的javascript中克隆一个新对象
【发布时间】：2019-04-20 01:49:39
【问题描述】：

我有一个像这样的多步骤 javascript 对象：

const source = {
  prev: [],
  current: {
    list: [{ a: 1, b: 2, c: 3 }],
    data: [{ c: 1, b: 2 }]
  },
  id: 12,
  next: []
};

我想创建一个新的副本。我知道如果我使用类似let copy = { ...source }; 的东西，它就像一个浅拷贝。因此，如果我在source 中更改这些数组或对象，它们也会在copy 中更改。

无论如何，通过解构，我可以获得所有项目的新副本吗？还是我应该像这样为每个级别手动执行此操作：

copy.prev = [...source.prev]
copy.current.list = [...source.current.list]
copy.current.data= [...source.current.data]

等等

【问题讨论】：

猜我理解错了问题。为什么不直接克隆原件并将其作为参考？并且稍后在原始版本中进行更新？为什么需要将所有级别分开？
简而言之，我有一个包含其他对象和数组作为属性的多级对象，我想拥有这个对象的新副本，其中所有项目都是新副本而不是引用。
那我的回答是正确的。

标签： javascript rest object ecmascript-6 destructuring

【解决方案1】：

有一种旧方法可以做到这一点，但仍然有效：

var cloned = JSON.parse(JSON.stringify(original));

【讨论】：

【解决方案2】：

你可以使用 JSON.stringify

    const source = {
  prev: [],
  current: {
    list: [{ a: 1, b: 2, c: 3 }],
    data: [{ c: 1, b: 2 }]
  },
  id: 12,
  next: []
};

newObj = JSON.parse(JSON.stringify(source));

【讨论】：

谢谢，我忘记了这个简单的解决方案。哈哈

【解决方案3】：

你可以这样解构：

const source = {
  prev: [],
  current: {
    list: [{ a: 1, b: 2, c: 3 }],
    data: [{ c: 1, b: 2 }]
  },
  id: 12,
  next: []
};

const {
current: {list: listClone, data: dataClone}
} = source

console.log(listClone, dataClone)

【讨论】：

【解决方案4】：

对于一个包含对象、数组和原语的简单对象，递归地克隆所有内容的代码并不多。

只需返回原语map() 数组，并减少将值传回的对象键。类似于：

const source = {prev: [],current: {list: [{ a: 1, b: 2, c: 3 }],data: [{ c: 1, b: 2 }]},id: 12,next: []};

function clone(obj){
    return (typeof obj == 'object')
        ? (Array.isArray(obj))
            ? obj.map(i => clone(i)) 
            : Object.entries(obj).reduce((o, [key, value]) => 
              Object.assign(o, {[key]: clone(value)}), {})  
        : obj

}

let a_clone = clone(source)
console.log(JSON.stringify(a_clone, null, 2))


// is the clone deep? should be false
console.log(a_clone.prev === source.prev)
console.log(a_clone.current.list === source.current.list)

【讨论】：