js数组复制给另一个空数组，改变其中一个，另一个数组也会改变

js数组复制给另一个空数组，改变其中一个，另一个数组也会改变

场景：

在vue中，我在data定义了变量，接收到了后台的数据，数组类型

我把它传递给了子组件，但是我并不想直接改变这个数据

于是我定义了一个空的数组，把当前数据赋值给了它。

但是，我们都知道，数组所指向的是内存地址，直接赋值会使它们指向同一地址。（深拷贝和浅拷贝）

那么问题就来了，当我改变其中一个数组的值，另一个数组也会随之发生变化。

其实解决办法最简单粗暴的办法就是循环数据数组，然后把每一项push到新数组，但是代码真的很不友好，写起来复杂。

解决办法：

我采用了es6的数组解构赋值，和扩展运算符结合的方式

const newArr = [ ...sult ]

但是我发现并没有解决我的问题。

我排查原因，并尝试解决办法，发现简单的数组类型是可以成功的，但是如果数组中嵌套的对象，那么这样还是不能解决我的问题。

网上查阅资料，最终参考另一位博主的文章，找到了解决办法。

const newArr = JSON.parse(JSON.sult))

这里先把数组转为json字符串，再转为json对象进行赋值，成功解决问题。

附上参考文章的地址：

如有问题，请指出，接收批评。

个人微信公众号：