如何理解深拷贝和浅拷贝

普通的基本数据类型并不是拷贝

      // 基本数据类型
      // 赋值 并不是拷贝
      let a = 5;
      let b = a;
      b = 3;
      console.log(a, b);

数组与对象的赋值都是浅拷贝

      let arr = [1, 2, 3];
      let newArr = arr;
      newArr.push(4);
      console.log(arr, newArr);

结构赋值    

针对一维数组和对象可以看做是深拷贝

  let arr = [1, 2, 3];
  let newArr = [...arr];
  newArr.push(4);
  console.log(arr, newArr);

针对二维数组和对象是浅拷贝

      let arr2 = [
        [1, 2, 3],
        [4, 5, 6],
      ];
      let newArr2 = [...arr2];
      newArr2[0].push(888);
      console.log(arr2, newArr2);

深拷贝的用法

      let list = [
        { id: 1, stuName: '小明', class: '五年二班' },
        { id: 2, stuName: '小红', class: '五年三班' },
        { id: 3, stuName: '小蓝', class: '五年四班' },
      ];
      let newList = JSON.parse(JSON.stringify(list));
      newList.push({ id: 888 });
      console.log(list, newList);

注意使用 JSON.parse(JSON.stringify(list)) 有一个弊端，就是方法不能进行拷贝。

标准的深拷贝 => 引用数据类型(数组，对象)

      function deepClone(source) {
        // [] => Array(基类) {} => Object
        const targetObj = source.constructor === Array ? [] : {};
        for (let keys in source) {
          if (source.hasOwnProperty(keys)) {
            // 引用数据类型
            if (source[keys] && typeof source[keys] === 'object') {
              targetObj[keys] = source[keys].constructor === Array ? [] : {};
              // 递归
              targetObj[keys] = deepClone(source[keys]);
            } else {
              // 基本数据类型，直接赋值
              targetObj[keys] = source[keys];
            }
          }
        }
        return targetObj;
      }

      let Obj = {
        aa: '哈哈',
        Bb: 1,
        cc: { str: '111', age: 12 },
        dd: [1, 2, 3, 4],
      };

      let newobj = deepClone(Obj);
      newobj.aa = '有钱不买收音机';
      newobj.dd.push('就听你在吹牛逼');

      console.log(Obj, newobj);

我们下期再见，希望可以帮到大家。