vue的浅拷贝和深拷贝场景

#浅拷贝：浅拷贝针对Object和Array这样的引用数据类型，就是原对象和拷贝后的对象 共同指向同一内存空间
，只要修改了对象的内容，两个对象的数据都会修改
#Object.assign是一种浅拷贝，下面的案例可以看到 把arr[0]拷贝给arr2，然后给arr2.list[0]重新赋值为999,
打印时会发现arr[0].list[0]的值也变为999
<script>
const arr = [
  { Name: '张三', list: [1, 2, 3] },
  { Name: '李四', list: [4, 5, 6] },
]

let arr2 = {
  Name: '',
  list: [],
}

Object.assign(arr2, arr[0])
arr2.list[0] = 999
console.log(arr)
console.log(arr2)
</script>

#打印的值为:
arr:[
  { Name: '张三', list: [999, 2, 3] },
  { Name: '李四', list: [4, 5, 6] },
]

arr2:
{ Name: '张三', list: [999, 2, 3] },

#深拷贝：会拷贝一份一样的对象，但是两个对象指向的内存空间不一样，修改数据不会影响另一个对象的数据
#通过JSON.parse(JSON.stringify()) 可实现深拷贝,案例中可以看到对arr2的修改就不会影响arr了
const arr = [
  { Name: '张三', list: [1, 2, 3] },
  { Name: '李四', list: [4, 5, 6] },
]

let arr2 = {
  Name: '',
  list: [],
}

Object.assign(arr2, JSON.parse(JSON.stringify(arr[0])))
arr2.list[0] = 999
console.log(arr)
console.log(arr2)