Question

这是我原来的数组：

var myArray = [
   {"A":"1", "B":"2"},
   {"C":"3", "D":"4"},
   {"E":"5", "F":"6"}
]

然后我创建了这个myArray的副本：

var copyArray = $.merge([], myArray);

现在我只想扩展copyArray的第一个元素：

$.extend(copyArray[0], { "Hello": "World" });

但结果是myArray和copyArray都被更改了。我只想要更改copyArray。它们都改为以下：

[
   {"A":"1", "B":"2", "Hello":"World"},
   {"C":"3", "D":"4"},
   {"E":"5", "F":"6"}
]

以下是我的小提琴：http://jsfiddle.net/LesignButure/GFVUy/

Answer 1

var myArray = [
       {"A":"1", "B":"2"},
       {"C":"3", "D":"4"},
       {"E":"5", "F":"6"}
    ];
var copyArray = $.extend(true, [], myArray);
$.extend(copyArray[0], { "Hello": "World" });
console.log(myArray);
console.log(copyArray);

试试这个..

Answer 2

如果数组中存在对象，则保留引用;即它没有做深刻的复制。

当一个真值作为初始参数传递时，jQuery的extend方法执行深层复制：

$.extend(true, [], myArray );

JSFIDDLE

Answer 3

当真值作为第一个参数传递时，

extend会执行深层复制，所以你可以这样做

var copyArray = $.extend(true, [], myArray);

有关详情，请参阅the docs。

这解决了您的问题。

Answer 4

您可以使用$.extend作为第一个参数传递true来执行深层复制：

var copyArray = $.extend(true, [], myArray);

http://jsfiddle.net/GFVUy/12/

Answer 5

使用jQuery $ .extend或纯 javascript

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
    <span>test addbutton component</span><br />
    <span>00</span><br />
    <span> component test</span><br />
    <span hidden="">1000</span>
    <p class="center">
       <button id="addButton">Add Button</button>
    </p>
</div>

纯javascript

/*
 * Extend Array extra json
 * Example: 
 * $.extendArray([{a:1,b:2}],[{c:3,d:4}]) return -> [{a:1,b:2},{c:3,d:4}]
 * $.extendArray([{a:1,b:2}],{c:3,d:4}) return -> [{a:1,b:2},{c:3,d:4}]
 *
 */
$.extend({
  extendArray: function() {
    return Array.prototype.concat.apply([], arguments);
  }
});

Answer 6

试试这个

 var copyArray = $.extend(true, [], myArray);

 $.extend(copyArray[0], { "Hello": "World" });

请参阅DEMO

jquery从数组中扩展json元素

6 个答案: