javascript - 通过复制所有自己的属性来克隆任何 javascript 对象

Question

如果我想克隆任何 javascript 对象(不为 null)，我想我可以使用 Object.getOwnPropertyNames 将它自己的所有属性(可枚举和不可枚举)复制到一个新的空对象上。

但我注意到 Dojo 工具包( https://davidwalsh.name/javascript-clone )提供的深度克隆函数示例将 RegExp、Date 和 Node 对象视为特殊情况，并且 lodash.cloneDeep 也有很多逻辑是比简单地复制属性要复杂得多，包括有自己的一些特殊情况，并且显然不支持所有类型的对象:( https://github.com/lodash/lodash/blob/master/.internal/baseClone.js )。

为什么仅仅复制对象属性还不够？ javascript 对象除了它的属性之外还有什么我不知道的？

编辑:明确地说，我正在谈论深度克隆对象。抱歉造成困惑。

Answer 1

如果顶级属性都是值对象，例如字符串和数字，那么只需复制顶级属性就可以复制对象。如果存在任何引用对象，例如日期、数组或其他对象，那么您所做的就是将引用从一个对象复制到另一个对象。如果您更改克隆上的引用对象，您将改变原始对象。

看看我的克隆函数 https://stackblitz.com/edit/typescript-qmzgf7

如果它是一个数组，它会克隆数组中的每个项目，如果它是一个日期，它会创建一个具有相同时间的新日期，如果它是一个对象，它会克隆每个属性，如果只是复制属性，它会克隆其他所有属性。

现在可以对克隆的对象进行变异，而不必担心它可能对原始对象产生的影响。

const clone = obj =>
  Array.isArray(obj)
    ? obj.map(item => clone(item))
    : obj instanceof Date
      ? new Date(obj.getTime())
      : (typeof obj === 'object') && obj
        ? Object.getOwnPropertyNames(obj).reduce((o, prop) => ({ ...o, [prop]: clone(obj[prop]) }), {})
        : obj;
        
let original = { prop1: "Original", objProp: { prop1: "Original" } };
let swallowCopy = { ...original };
let clonedObj = clone(original);

clonedObj.prop1 = "Changed";
clonedObj.objProp.prop1 = "Changed";

console.log(`Original objects properties are '${original.prop1}' and '${original.objProp.prop1}'`);

swallowCopy.prop1 = "Changed";
swallowCopy.objProp.prop1 = "Changed";

console.log(`Original objects properties are '${original.prop1}' and '${original.objProp.prop1}'`);

请注意修改对象属性浅拷贝上的属性如何导致原始属性也发生更改。