JS中对象的浅拷贝和深拷贝 原生JS手写对象浅拷贝和深拷贝

一.、为什么要拷贝对象??

      1. 如果想在不改变原对象的情况下想要更改该对象的属性，那么就可以对原对象进行拷贝

二、 浅拷贝和深拷贝的区别？ 

       1. 浅拷贝: 如果原对象的层次比较浅的话就可以直接用ES6的扩展运算符对原对象进行拷贝

​
    let obj = {
        name: '张三',
        age: '99',
      }

      let newObj = { ...obj }
      console.log(obj)
      console.log(newObj)

​

2. 如果原对象层次较深，用浅拷贝的话修改新对象或原对象中层次较深的属性时两个对象都会受到影响，简单点说就是修改其中一个另一个会受到影响

 let obj = {
        a: {
          b: {
            c: {
              x: 999,
            },
          },
        },
      }

      let newObj = { ...obj }
      obj.a.b.c.x = 0
      console.log(obj) //  obj.a.b.c.x = 0
      console.log(newObj) //  newObj.a.b.c.x = 0

3. 深拷贝: 拷贝下来的新对象和原对象的地址值不同 这时候两个对象都是唯一的，修改其中一个不会影响另一个

//                 原对象   新对象
function deepClone(origin, target) {
  // 可能不会传新对象 如果没有则给一个空对象
  const tar = target || {}
  const toStr = Object.prototype.toString
  for (let k in origin) {
    // 判断 k 是不是自己身上的一个属性  不会从原型链上查找
    if (origin.hasOwnProperty(k)) {
      // 判断 k 是不是一个对象 {} []         不能是null 因为null的类型也是Object
      if (typeof origin[k] === 'object' && origin[k] !== null) {
        // 如果 origin[k] 是数组 就给一个空数组 否则给一个空对象
        tar[k] = toStr.call(origin[k]) === '[object Array]' ? [] : {}
        // 如果是的话 递归 继续克隆
        deepClone(origin[k], tar[k])
      } else {
        tar[k] = origin[k]
      }
    }
  }
  return tar
}