一、一個簡單的js方法實現集合拷貝

　　做web項目的時候，少不了和js中的數組，集合等對象接觸，那么你肯定會發現，在js中存在一個怪異的現象就是數組和集合的拷貝都是地址復制，并不是簡單的數據的拷貝。

舉個例子：

//創建一個集合 var arr1=[{name:'小明',age:'22'},{name:'小剛',age:'23'}] //再創建一個空集合 var arr2=[] //開始拷貝集合arr1的第一個元素數據到集合arr2中 arr2.push(arr1[0]) //取出arr2中的數據，修改一下屬性值 arr2[0].name="小強"

那么這個時候，集合arr1和arr2的數會發生怎么樣的變化呢？

按照正常的邏輯，我們只改變了集合arr2的數據，那么arr1中的數據肯定是不會受到影響的。但是，事實卻是arr1集合中的數據，也發生了變化。

請看下面的debugger測試截圖

從上圖可以清晰看到，arr1中的數據也發生了變化，也就是說?

//開始拷貝集合arr1的第一個元素數據到集合arr2中 arr2.push(arr1[0])

?

?實際上集合arr2是把集合arr1第一個元素對象的引用（地址）拷貝過來了，這樣的拷貝會導致一改全改的現象，不是我們想要的。那么如何避免這種現象呢？

很簡單，看下面的代碼：

//實現原生js-Copy方法function copyObj(arr){var obj=arr instanceof Array?[]:{};for(var item in arr){if(typeof arr[item]=== "object"){obj[item]=copyObj(arr[item]);}else{obj[item]=arr[item];}}return obj;}

?

使用上面的copy()方法再試試看：

//創建一個集合 var arr1=[{name:'小明',age:'22'},{name:'小剛',age:'23'}] //再創建一個空集合 var arr2=[] //開始拷貝集合arr1的第一個元素數據到集合arr2中 var eachData=arr1[0]; arr2.push(copy(eachData)) //取出arr2中的數據，修改一下屬性值 arr2[0].name="小強"

?

再看一下，此時的情況吧！

?

?

效果是不是很明顯哈！

?

轉載于:https://www.cnblogs.com/newwind/p/8920657.html

總結

以上是生活随笔為你收集整理的js/jq基础（日常整理记录）-2-一个简单的js方法实现集合的非引用拷贝的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。