使用JSON进行深拷贝

var newObject = JSON.parse(JSON.stringify(oldObject))

var oldObject = {
  name: 'A',
  address: {
    street: 'Station Road',
    city: 'Pune'
  }
}
var newObject = JSON.parse(JSON.stringify(oldObject));

newObject.address.city = 'Delhi';
console.log('newObject');
console.log(newObject);
console.log('oldObject');
console.log(oldObject);

ES6 没有内置这样的功能。我认为您有几种选择，具体取决于您想要做什么。

如果你真的想深拷贝：

1. 使用图书馆。例如，lodash 有一个cloneDeep方法。
2. 实现自己的克隆功能。

您的特定问题的替代解决方案（无深度复制）

然而，我认为，如果你愿意改变一些事情，你可以为自己节省一些工作。我假设您控制所有调用站点到您的功能。

1. 指定传递给的所有回调mapCopy必须返回新对象，而不是改变现有对象。例如：

   mapCopy(state, e => {
     if (e.id === action.id) {
       return Object.assign({}, e, {
         title: 'new item'
       });
     } else {  
       return e;
     }
   });
   

   这利用Object.assign来创建一个新对象，e在该新对象上设置属性，然后在该新对象上设置新标题。这意味着您永远不会改变现有对象，仅在必要时创建新对象。

2. mapCopy 现在可以很简单：

   export const mapCopy = (object, callback) => {
     return Object.keys(object).reduce(function (output, key) {
       output[key] = callback.call(this, object[key]);
       return output;
     }, {});
   }
   

从本质上讲，mapCopy是相信调用者会做正确的事情。这就是为什么我说这假设您控制所有呼叫站点。

来自 MDN

注意：在复制数组时，Spread 语法有效地深入一层。因此，它可能不适合复制多维数组，如下例所示（与 Object.assign() 和 spread 语法相同）。

就个人而言，我建议使用Lodash 的 cloneDeep函数进行多级对象/数组克隆。

这是一个工作示例：

const arr1 = [{ 'a': 1 }];

const arr2 = [...arr1];

const arr3 = _.clone(arr1);

const arr4 = arr1.slice();

const arr5 = _.cloneDeep(arr1);

const arr6 = [...{...arr1}]; // a bit ugly syntax but it is working!


// first level
console.log(arr1 === arr2); // false
console.log(arr1 === arr3); // false
console.log(arr1 === arr4); // false
console.log(arr1 === arr5); // false
console.log(arr1 === arr6); // false

// second level
console.log(arr1[0] === arr2[0]); // true
console.log(arr1[0] === arr3[0]); // true
console.log(arr1[0] === arr4[0]); // true
console.log(arr1[0] === arr5[0]); // false
console.log(arr1[0] === arr6[0]); // false

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.js"></script>

我经常使用这个：

function deepCopy(obj) {
    if(typeof obj !== 'object' || obj === null) {
        return obj;
    }

    if(obj instanceof Date) {
        return new Date(obj.getTime());
    }

    if(obj instanceof Array) {
        return obj.reduce((arr, item, i) => {
            arr[i] = deepCopy(item);
            return arr;
        }, []);
    }

    if(obj instanceof Object) {
        return Object.keys(obj).reduce((newObj, key) => {
            newObj[key] = deepCopy(obj[key]);
            return newObj;
        }, {})
    }
}

const a = {
  foods: {
    dinner: 'Pasta'
  }
}
let b = JSON.parse(JSON.stringify(a))
b.foods.dinner = 'Soup'
console.log(b.foods.dinner) // Soup
console.log(a.foods.dinner) // Pasta

使用JSON.stringify和JSON.parse是最好的方法。因为通过使用扩展运算符，当 json 对象包含另一个对象时，我们将无法得到有效的答案。我们需要手动指定。