深层拷贝对象的问题

现有文件aaa.json,内容如下:

{
  "data": [{
    "id": "0",
    "name": "报表demo-此处是表头",
    "dataField": "",
    "childs": [
      {
        "id": "1",
        "name": "第一个",
        "dataField": "date",
        "childs": []
      },
      {
        "id": "2",
        "name": "第二个",
        "dataField": "",
        "childs": [
          {
            "id": "2-1",
            "name": "第二层",
            "dataField": "name",
            "childs": []
          }
        ]
      }
    ]
  }]
}

定义对象ccc如下:

data () {
  return {
    ccc: []
  }
},

赋值对象,查看深层拷贝问题如下:

console.log(JSON.stringify(aaa), 'aaa1')
console.log(JSON.stringify(self.ccc), 'ccc1')
// self.ccc = aaa.data // 直接赋值浅拷贝
// self.ccc = aaa.data.slice() // 深拷贝-不可以
self.ccc = JSON.parse(JSON.stringify(aaa.data)) // 深拷贝-可以
// 定义一个变量插入到数组对象中
let obj = {
  childs: [],
  dataField: 'wname',
  id: 'date',
  name: '时间',
  isFirst: true
}
// self.ccc.push(obj) // 放到第一层slice和JSON 深拷贝-都可以
self.ccc[0].childs.push(obj) // 放到里层slice 深拷贝-不可以
console.log(JSON.stringify(aaa), 'aaa2')
console.log(JSON.stringify(self.ccc), 'ccc2')

对应效果截图:

可以的情况,我们看到时间这个对象只插入到了ccc,没有改变aaa。
在这里插入图片描述
不可以的情况,我们看到时间这个对象既插入到了ccc,同时改变了aaa。
在这里插入图片描述

总结:

slice好像外层确实深拷贝了,但是往子节点插入数据发现,内层并没有啊,只能用JSON.parse(JSON.stringify)了。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值