我是cloning/copyingjavascript对象。我做对了吗？

Question

我一直在阅读有关克隆的文章，似乎每个人都在使用一些复杂的代码。我想我可能做错了，但它似乎在工作，并且在更改 "cloned" 对象属性的值时，我的主要对象没有改变。

var clonedObject ={};
//randomItem is main object, which I want to clone
for (var key in randomItem) {
    if (randomItem.hasOwnProperty(key)) {
        clonedObject[key] = {};
        clonedObject[key] = randomItem[key];
    }
};
return clonedObject;

它对我有用，请告诉我它是否有问题？我很困惑，因为与其他帖子所说的相比，这似乎太容易了（其中一些已经 7 岁了）。谢谢

Answer 1

// Shallow copy
var newObject = jQuery.extend({}, oldObject);

// Deep copy
var newObject = jQuery.extend(true, {}, oldObject);

What is the most efficient way to deep clone an object in JavaScript?

在 nodeJS 中我使用下划线模块让 newObj = _.clone(oldObj);

Answer 2

这是一个简单的示例，您可以在其中了解与真正的深层克隆相比，您的代码如何处理嵌套对象：

var x = {a:{a:1}};

function update () {
  document.getElementById('x').textContent = JSON.stringify(x);
  document.getElementById('y').textContent = JSON.stringify(y);
  document.getElementById('z').textContent = JSON.stringify(z);
}

// This is your code
function yourClone (randomItem) {
  var clonedObject ={};
  for (var key in randomItem) {
    if (randomItem.hasOwnProperty(key)) {
      clonedObject[key] = {};
      clonedObject[key] = randomItem[key];
    }
  };
  return clonedObject;
}

// This is a real deep clone taken from 
function deepClone (obj) {
  var copy;

  // Handle the 3 simple types, and null or undefined
  if (null == obj || "object" != typeof obj) return obj;

  // Handle Date
  if (obj instanceof Date) {
    copy = new Date();
    copy.setTime(obj.getTime());
    return copy;
  }

  // Handle Array
  if (obj instanceof Array) {
    copy = [];
    for (var i = 0, len = obj.length; i < len; i++) {
      copy[i] = deepClone(obj[i]);
    }
    return copy;
  }

  // Handle Object
  if (obj instanceof Object) {
    copy = {};
    for (var attr in obj) {
      if (obj.hasOwnProperty(attr)) copy[attr] = deepClone(obj[attr]);
    }
    return copy;
  }

  throw new Error("Unable to copy obj! Its type isn't supported.");
}


function inc() {
  x.a.a++;
  update();
}

<body onload="y=yourClone(x);z=deepClone(x);update()">
  x: <span id="x"></span><br/>
  y: <span id="y"></span> &lt;- your clone from 'x'<br/>
  z: <span id="z"></span> &lt;- real deep clone from 'x'<br/><br/>
  <button id="inc" onclick="inc()">Increment nested element in x</button>
</body>

当您将某个变量的值复制到另一个变量时，根据数据类型，您将复制值本身（数字和文本）或只是对数据（日期、数组和对象）的引用.当你处理引用时，你将需要递归地进入下一个级别并将所有值复制到新对象中以创建新实例。

我是cloning/copyingjavascript对象。我做对了吗？

I am cloning/copying javascript object. Am I doing it right?

javascript

javascript-objects