在JavaScript中克隆对象

以下内容首先记录0，然后记录1。如何存储对象的副本，而不是对其的引用？

debug.log(vi.details.segment);
vi.nextSegment = vi.details;
vi.nextSegment.segment++;
debug.log(vi.details.segment);

要在jQuery中克隆对象：

var vi.nextSegment = jQuery.extend({}, vi.details);

注意：以上内容是浅表副本：任何嵌套对象或数组都将通过引用进行复制-表示您所做的任何更改vi.nextSegment.obj[prop]都将反映在中vi.details.obj[prop]。如果您想要一个与原始对象完全分开的全新对象，则需要进行深层复制（通过true作为第一个参数）：

var vi.nextSegment = jQuery.extend(true, {}, vi.details);

要阅读更多扩展内容，请参见此处。

看一下文章：克隆javascript对象的最有效方法是什么

根据John Resig的回答：

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

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

可以在jQuery文档中找到更多信息。

这对我使用jQuery“ parseJSON（）”和“ JSON.stringify（）”克隆对象的效果更好。

$.ajax({
  url: 'ajax/test.html',
  dataType: 'json',
  success: function(data) {
    var objY = $.parseJSON(JSON.stringify(data));
    var objX = $.parseJSON(JSON.stringify(data));
  }
});

在objX和objY中克隆数据对象是两个不同的对象，您不必搞乱“按引用”问题

格拉西亚斯！

克隆对象的另一种方法是

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

但请注意是否包含日期。在这种情况下，JSON.parse将返回date.toString（）而不是date。

这是我多次复制元素的方式：

首先我有一个模板：

<div class="forms-container">
    <div class="form-template">
        First Name <input>
         .. a lot of other data ...
        Last Name <input>
     <div>
     <button onclick="add_another();">Add another!</button>
<div>

现在，JavaScript：

function add_another(){
    jQuery(".form-template").clone().appendTo(".forms-container");
}

尝试Immutable.js：

由于jQuery主要处理DOM Elements，因此它可能不是正确的工具。 Immutable.js是由56 kb (minified)创建的库Facebook。

// roughly implementing
import Immutable from 'immutable'
//
const oldObj = { foo: 'bar', bar: 'baz' }
// create a map from the oldObj and then convert it to JS Object
const newObj = Immutable.Map(oldObj).toJS()

这样，您将可以有效地newObj从克隆oldObj。基本上，如果您还没有Map，那么我们需要创建一个Map。Map就像blue-print我们一起创建的地图copies。

参考文献：

家- 不可变

文件- 不可变文件

GitHub- 不可变@GitHub

祝好运。

如果需要保留初始对象，但需要使用新选项覆盖数据，则可以将多个对象传递给$ .extend（jQuery），第一个选项为true：

var opts_default = {opt1: true, opt2: false};
var opts_new = {opt1: false};
var opts_final = $.extend(true, {}, opts_default, opts_new);