blocks|key|4534538|text|试一试|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4534539|var+copy+=+JSON.parse(JSON.stringify(tags));|code-block|syntax|javascript|4534540|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>Try</p>

<pre><code>var copy = JSON.parse(JSON.stringify(tags));
</code></pre>


blocks|key|4534574|text|请尝试以下操作|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4534575|//+Deep+copy
var+newArray+=+jQuery.extend(true,+[],+oldArray);|code-block|syntax|javascript|4534576|有关更多详细信息，请查看此问题What+is+the+most+efficient+way+to+deep+clone+an+object+in+JavaScript?|offset|length|4534577|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/122102/what-is-the-most-efficient-way-to-clone-an-object^0|0|0|F|1X|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@$I|V|J|W|1|X]]|A|$]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|L|$M|$5|N|O|P|A|$Q|R]]]]

<p>Try the following</p>

<pre><code>// Deep copy
var newArray = jQuery.extend(true, [], oldArray);
</code></pre>

<p>For more details check this question out <a href="https://stackoverflow.com/questions/122102/what-is-the-most-efficient-way-to-clone-an-object">What is the most efficient way to deep clone an object in JavaScript?</a></p>


blocks|key|27197|text|使用ES6克隆对象数组的一个好方法是使用扩展语法：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|27198|const+clonedArray+=+[...oldArray];|code-block|syntax|javascript|27199|MDN|offset|length|27200|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax^0|0|0|0|3|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@$I|V|J|W|1|X]]|A|$]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|L|$M|$5|N|O|P|A|$Q|R]]]]

<p>A nice way to clone an array of objects with ES6 is to use spread syntax:</p>

<pre><code>const clonedArray = [...oldArray];
</code></pre>

<p><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax" rel="nofollow noreferrer">MDN</a></p>


blocks|key|4534726|text|你只需要用“...”符号。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4534727|//+THE+FOLLOWING+LINE+COPIES+all+elements+of+'tags'+INTO+'copy'
var+copy+=+[...tags]|code-block|syntax|javascript|4534728|当你有一个数组，比如x，...x会创建一个包含所有x值的新数组。要小心，因为这种表示法在对象上的作用略有不同。它将对象拆分成它的所有键、值对。因此，如果你想把一个对象的所有键值对都传递到一个函数中，你只需要传递函数({...obj})|4534729|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>You just need to use the '...' notation.</p>

<pre><code>// THE FOLLOWING LINE COPIES all elements of 'tags' INTO 'copy'
var copy = [...tags]
</code></pre>

<p>When you have an array say x, [...x] creates a new array with all the values of x. Be careful because this notation works slightly differently on objects. It splits the objects into all of its key, value pairs. So if you want to pass all the key value pairs of an object into a function you just need to pass function({...obj})</p>


blocks|key|27165|text|同样的问题也发生在我身上。我有来自服务的数据，并保存到另一个变量中。每当我更新我的数组时，复制的数组也会更新。旧代码如下所示|type|unstyled|depth|inlineStyleRanges|entityRanges|data|27166|​|27167|//$scope.MyData+get+from+service
$scope.MyDataOriginal+=+$scope.MyData;|code-block|syntax|javascript|27168|27169|因此，当我更改$scope.MyData时，也会更改$scope.MyDataOriginal。我找到了一个解决方案，angular.copy正确的代码如下|27170|27171|$scope.MyDataOriginal+=+angular.copy($scope.MyData);|27172|27173|entityMap^0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|S|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|T|8|@]|9|@]|A|$G|H]]|$1|I|3|C|5|6|7|U|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|V|8|@]|9|@]|A|$]]|$1|L|3|C|5|6|7|W|8|@]|9|@]|A|$]]|$1|M|3|N|5|F|7|X|8|@]|9|@]|A|$G|H]]|$1|O|3|C|5|6|7|Y|8|@]|9|@]|A|$]]|$1|P|3|-4|5|6|7|Z|8|@]|9|@]|A|$]]]|Q|$]]

<p>Same issue happen to me. I have data from service and save to another variable. When ever I update my array the copied array also updated. old code is like below</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>//$scope.MyData get from service
$scope.MyDataOriginal = $scope.MyData;</code></pre>
</div>
</div>
</p>

<p>So when ever I change $scope.MyData also change $scope.MyDataOriginal. 
I found a solution that angular.copy right code as below</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>$scope.MyDataOriginal = angular.copy($scope.MyData);</code></pre>
</div>
</div>
</p>


blocks|key|27244|text|我知道这是一个有点老的帖子，但我很幸运地找到了一个很好的方法来深度复制数组，甚至那些包含数组和对象的数组，甚至包含数组的对象也会被复制……我只看到这个代码的一个问题是，如果你没有足够的内存，我可以看到这个非常大的数组和对象数组的阻塞……但在大多数情况下，它应该是有效的。我在这里发布这篇文章的原因是，它完成了按值而不是按引用复制对象数组的操作请求……所以现在有了代码(检查来自SO，我自己编写的主要复制函数，并不是说其他人可能以前没有写过，我只是不知道它们)：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|27245|var+isArray+=+function(a){return+(!!a)+&&+(a.constructor===Array);}
var+isObject+=+function(a){return+(!!a)+&&+(a.constructor===Object);}
Array.prototype.copy+=+function(){
++++var+newvals=[],
++++++++self=this;
++++for(var+i+=+0;i+<+self.length;i%2B%2B){
++++++++var+e=self[i];
++++++++if(isObject(e)){
++++++++++++var+tmp={},
++++++++++++++++oKeys=Object.keys(e);
++++++++++++for(var+x+=+0;x+<+oKeys.length;x%2B%2B){
++++++++++++++++var+oks=oKeys[x];
++++++++++++++++if(isArray(e[oks])){
++++++++++++++++++++tmp[oks]=e[oks].copy();
++++++++++++++++}+else+{+
++++++++++++++++++++tmp[oks]=e[oks];
++++++++++++++++}
++++++++++++}
++++++++++++newvals.push(tmp);
++++++++}+else+{
++++++++++++if(isArray(e)){
++++++++++++++++newvals.push(e.copy());
++++++++++++}+else+{
++++++++++++++++newvals.push(e);
++++++++++++}
++++++++}
++++}
++++return+newvals;
}|code-block|syntax|javascript|27246|当一个对象或数组被调用时，这个函数(Array.prototype.copy)使用递归来调用它自己，根据需要返回值。这个过程是相当快的，并且做了你想要它做的事情，它通过值做了一个数组的深度拷贝…在chrome和IE11上测试过，它可以在这两种浏览器上工作。|27247|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>I know that this is a bit older post but I had the good fortune to have found a decent way to deep copy arrays, even those containing arrays, and objects, and even objects containing arrays are copied... I only can see one issue with this code is if you don't have enough memory I can see this choking on very large arrays of arrays and objects... But for the most part it should work. The reason that I am posting this here is that it accomplishes the OP request to copy array of objects by value and not by reference... so now with the code (the checks are from SO, the main copy function I wrote myself, not that some one else probably hasn't written before, I am just not aware of them)::</p>

<pre><code>var isArray = function(a){return (!!a) &amp;&amp; (a.constructor===Array);}
var isObject = function(a){return (!!a) &amp;&amp; (a.constructor===Object);}
Array.prototype.copy = function(){
    var newvals=[],
        self=this;
    for(var i = 0;i &lt; self.length;i++){
        var e=self[i];
        if(isObject(e)){
            var tmp={},
                oKeys=Object.keys(e);
            for(var x = 0;x &lt; oKeys.length;x++){
                var oks=oKeys[x];
                if(isArray(e[oks])){
                    tmp[oks]=e[oks].copy();
                } else { 
                    tmp[oks]=e[oks];
                }
            }
            newvals.push(tmp);
        } else {
            if(isArray(e)){
                newvals.push(e.copy());
            } else {
                newvals.push(e);
            }
        }
    }
    return newvals;
}
</code></pre>

<p>This function (Array.prototype.copy) uses recursion to recall it self when an object or array is called returning the values as needed. The process is decently speedy, and does exactly what you would want it to do, it does a deep copy of an array, by value... Tested in chrome, and IE11 and it works in these two browsers. </p>


blocks|key|27099|text|为此，我使用了新的ECMAScript+6+Object.assign方法：|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|27100|let+oldObject+=+[1,3,5,"test"];
let+newObject+=+Object.assign({},+oldObject)|code-block|syntax|javascript|27101|这个方法的第一个参数是要更新的数组，我们传递一个空对象，因为我们想要一个全新的对象，|27102|您还可以添加其他要复制的对象：|27103|let+newObject+=+Object.assign({},+oldObject,+o2,+o3,+...)|27104|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign^0|M|D|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@]|9|@$A|X|B|Y|1|Z]]|C|$]]|$1|D|3|E|5|F|7|10|8|@]|9|@]|C|$G|H]]|$1|I|3|J|5|6|7|11|8|@]|9|@]|C|$]]|$1|K|3|L|5|6|7|12|8|@]|9|@]|C|$]]|$1|M|3|N|5|F|7|13|8|@]|9|@]|C|$G|H]]|$1|O|3|-4|5|6|7|14|8|@]|9|@]|C|$]]]|P|$Q|$5|R|S|T|C|$U|V]]]]

<p>For this i use the new ECMAScript 6 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign" rel="nofollow noreferrer">Object.assign</a> method :</p>

<pre><code>let oldObject = [1,3,5,"test"];
let newObject = Object.assign({}, oldObject)
</code></pre>

<p>the first argument of this method is the array to be updated,
we pass an empty object because we want to have a completely new object,</p>

<p>also you can add other objects to be copied too :</p>

<pre><code>let newObject = Object.assign({}, oldObject, o2, o3, ...)
</code></pre>


<p>Copying an array of objects into another array in javascript using slice(0) and concat() doesnt work.</p>

<p>I have tried the following to test if i get the expected behaviour of deep copy using this. But the original array is also getting modified after i make changes in the copied array.</p>

<pre><code>var tags = [];
for(var i=0; i&lt;3; i++) {
    tags.push({
        sortOrder: i,
        type: 'miss'
    })
}
for(var tag in tags) { 
    if(tags[tag].sortOrder == 1) {
        tags[tag].type = 'done'
    }
}
console.dir(tags)

var copy = tags.slice(0)
console.dir(copy)

copy[0].type = 'test'
console.dir(tags)

var another = tags.concat()
another[0].type = 'miss'
console.dir(tags)
</code></pre>

<p>How can i do a deep copy of a array into another, so that the original array is not modified if i make a change in copy array.</p>


Copying an array of objects into another array in javascript (Deep Copy)

jQuery

JSON

在javascript中，使用slice(0)和concat()将对象数组复制到另一个数组中不起作用。我已经尝试了下面的方法来测试我是否使用它获得了深度复制的预期行为。但在我对复制的数组进行更改后，原始数组也会被修改。var tags = [];for(var i=0; i<3; i++) {    tags.push({        sortOrder: i,        type: 'mi

问在javascript中将对象数组复制到另一个数组中(深度复制)
EN

回答 7

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在javascript中将对象数组复制到另一个数组中(深度复制)EN

回答 7

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在javascript中将对象数组复制到另一个数组中(深度复制)
EN