数组对象的深浅拷贝，别再入坑

Question

先说目的

在vue中，有数组X，数组中有很多个对象。想实现这个数组的深拷贝。某个地方要使用拷贝数组X1。

问题是：我X1是深拷贝的。但是我修改了X，依然会影响X1。我想要的效果是两者互补影响

以下是我的理解：vue中的setter。是监听属性变化。只要属性一变。属性相关的操作都会在做一遍，所以我深拷贝了一份最新修改的，不知道我这样理解对不对？？？

解决方法

http://codepen.io/shenyuanyua...

Answer 1

var obj = {a : 1}
var arr = [obj]
arr.slice(0)[0] === obj // true

简单的对象可以这样拷贝，JSON.parse(JSON.stringify(obj))

Answer 2

单单slice，只能拷贝数组而已，数组元素如果是对象，那就不是深拷贝了。我之前遇到过。

简单写了个方法实现：其实就是遍历数组的时候数组元素如果是对象，用Object.assign来拷贝一份。不然的话，两个数组里的元素还是共用的同一份对象

function copyArr(arr){
        return arr.map((e)=>{
            if(typeof e === 'object'){
                return Object.assign({},e)
            }else{
                return e
            }
        })
    }

Answer 3

this.copylist = this.list.slice(0)
并不是深拷贝

Answer 4

可以点连接跳到codePen的代码。。不知道为什么粘贴过来运行不正确。

Answer 5

深拷贝vue里一句话就能实现
Vue实现对数组、对象的副本拷贝、复制

Answer 6

function coppyArray(arr){
   return arr.map((e)=>{
        if(typeof e==='object'){
           return Object.assign({},e);
         }else{
           return e;
       }
     }) 
 }