Es6

ES6扩展运算符和深浅拷贝总结

2020-11-26 14:29发布

    在ES6中新增了扩展运算符,可以实现对数组和对象的复制,那么这种复制是深拷贝还是浅拷贝呢?

我们发现arr和arr0的比较结果为false,那么我们初步判断二者不是同一个地址引用,接下来修改arr0,来观测arr是否发生改变:

,我们发现,修改arr0的值,并不影响arr值的改变,是不是说明扩展运算符的复制就是深拷贝呢?

    接下来,我们来测试一下复杂的数组:

我们修改数组的第一个元素(该元素自身为数组),则发现两个数组的值都发生了改变。

其实,从上面 的两个示例可以看出来,扩展运算符对数据的复制,其实依然属于浅拷贝。

那么,咱就总结一下,哪些方案可以实现浅拷贝和深拷贝:

1)浅拷贝

    • Object.assign()     该方法用于对象复制时,也是浅拷贝

    • 数组的slice方法、concat方法、Array.from方法以及扩展运算符都算是浅拷贝

2)深拷贝

    • 递归方案       经典的方案 (其实就是通过循环一层一层的进行拷贝)

    • JSON.parse()方法       这个方案简单易懂,不过也有缺点,对于undefined、function、symbol 会在转换过程中被忽略