深克隆和浅克隆

深克隆和浅克隆

浅克隆和深克隆最大的区别就是对引用值的处理,即浅克隆之后你改我也改,深克隆之后你改我不改。

对象克隆：

const stu = { // 第一层
  name: '张三',
  birthday: '1999-01-01',
  address: { // 第二层
    province: '四川',
    city: '成都',
    detail: [], // 第三层
  },
}

console.log(stu)

1、浅克隆：对象第一层是直接克隆值，第二层及以下是克隆的引用

const copy = {
  ...stu,
}
console.log(copy)
console.log(copy === stu) // false
// 第二层及以下的值，是相等的
console.log(copy.address === stu.address) // true
// 如果修改第二层及以下的值，原本对象的第二层及以下的值也会相应改变
copy.address.city = '绵阳'
console.log(stu)

2、深克隆：每一层都克隆值

const copyDeep = JSON.parse(JSON.stringify(stu))
console.log(copyDeep); //和stu一样
// 修改第一层的值和第二层及以下的值都会相应改变
copyDeep.name="李四"
copyDeep.address.city = '乐山'
console.log(copyDeep);

深克隆的实现方式请跳转至深克隆