在 JavaScript 中克隆对象

下面首先记录 0，然后记录 1。如何存储对象的 收到，而不是 参考文献？

debug.log(vi.details.segment);
vi.nextSegment = vi.details;
vi.nextSegment.segment++;
debug.log(vi.details.segment);
97912 次浏览
小开
最佳答案

在 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));
}
});

在 objecX 和 objecY 中克隆数据对象是两个不同的对象，你没有必要搞砸“通过引用”的问题

谢谢！

小开

下面是我多次复制元素的方法:

首先，我有一个模板:

<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");
}
小开

克隆对象的另一种方法是

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

但是如果它包含日期，就要小心了。在这种情况下，JSON.parse 将返回 date.toString ()而不是 date。

小开

试试 Immutable.js:

由于 jQuery主要处理 DOM Elements，因此 也许不会是做这项工作的合适工具。Immutable.js是由 Facebook创建的 56 kb (minified)库。

// 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()

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

参考文献:

Home- < a href = “ https://facebook.github.io/Immutable-js/”rel = “ nofollow norefrer”> Immutable

不可变文档

GitHub- Immutable@GitHub

祝你好运。

小开

如果需要保留初始对象，但需要用新选项覆盖数据，则可以将多个对象传递给 $。在第一个选项中使用 true 扩展(jQuery) :

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

提交答案