Javascript - 如何克隆一个对象？

Question

我很迷惑。 我创建一个副本myObjOne ，比我删除的条目myObjOne和JS删除我的副本（入门myObjTwo ）吗？ 但为什么？

  myObjOne = {};
  myObjOne['name'] = 'xxx';
  myObjOne['id'] = 'yyy';
  myObjOne['plz'] = 'zzz';  

  // clone
  myObjTwo = myObjOne;

  // remove something
  delete myObjOne['name'];

  console.dir(myObjTwo);

示例http://jsbin.com/itixes/edit#javascript,html

Answer 1

更新：删除Object.create作为一种克隆方法，如注释中所示。

  myObjTwo = myObjOne;

不克隆。 它只是复制引用。

如果要克隆，可以使用JSON.parse和JSON.stringify

var x = {a:{b:{c:{'d':'e'}}}};
var y = JSON.parse(JSON.stringify(x));  //y is a clone of x
console.log(y.a.b.c.d); //prints e
console.log(y === x); //prints false

警告：正如 Raynos 在评论中提到的，这个基于 JSON 的克隆不会在输出对象中保留输入对象的方法。 如果您的对象不包含任何方法，此解决方案就足够了。 方法是作为函数的对象的属性。 如果var obj = {add : function(a,b){return a+b;}}那么add是obj一个方法。

如果您需要支持方法复制的解决方案，请查看这些 SO 答案（如 musefan、Matt 和 Ranhiru Cooray 所指出的）

• 如何正确克隆 JavaScript 对象？
• 在 JavaScript 中深度克隆对象的最有效方法是什么？

我建议如何正确克隆 JavaScript 对象？

Answer 2

你可以像这样使用jQuery：

var myObjTwo = jQuery.extend(true, {}, myObjOne);

第一个参数表明我们想要制作myObjOne的深层副本。

Answer 3

这不是您克隆的方式，它只是将相同的原始对象存储在一个额外的变量中。 也许这个答案会帮助你

Answer 4

关于如何不仅复制对象及其属性，而且复制由其属性引用的所有对象的大量建议。 这是一个克隆对象而不复制它的版本，以便克隆继承以后添加的所有属性，除了那些被克隆的自己的属性遮蔽的属性：

var cloneOf = (function() {
  function F(){}
  return function(o) {
    F.prototype = o;
    return new F();
  }
}());

有些人可能会认出这种模式。 一个例子：

var base = {foo:'foo', bar:'bar'};
var baseClone = cloneOf(base);
alert(baseClone.foo);  // foo

Answer 5

您可以使用Object.assign()但要注意浏览器支持。

更多信息： https : //developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign 。

例子：

myObjTwo = Object.assign({}, myObjOne);

Answer 6

简单的。

var clone=function(o){
      var n= {}.toString.apply(o)=="[object Array]" ? []:{};
      for(i in o)
         n[i]= typeof o[i]=='object' ? clone(o[i]):o[i];
      return n;
 };

用法：

var x={a:{d:34},b:33};
var y=clone(x);  // clones 'x'

Answer 7

在 ES6 中，使用展开运算符。

myObjTwo = {...myObjOne}

es6 中的扩展运算符只是一个省略号。 它会创建原件的副本，即使原件已被销毁

Answer 8

您的行myObjTwo = myObjOne不会克隆myObjOne ，它只是创建对同一对象的重复引用！

实际的答案是使用克隆函数，可能来自诸如underscore.js 之类的库。 但实际上，您似乎对 Javascript 中的对象和指针的概念有一些阅读和学习经验。