深拷贝和浅拷贝，都只针对引用类型的数据

  • 浅拷贝：指的就是引用类型的数据，在拷贝过程中，只要内部有一条数据的地址没有更换，就属于浅拷贝
  • 深拷贝：指的就是引用类型的数据，在拷贝过程中，所有的引用数据都更换了新的地址，就属于深拷贝

    一、浅拷贝的常用方法

    1、扩展运算符

    扩展运算符，可以用来更换引用类型数据最外层的地址。
    1. const arr = [1, 2, 3];
    2. const newArr = [...arr];
    3. const obj = { a: 1, b: 2 };
    4. const newObj = { ...obj };

    2、Object.assign()

    1. const obj = { a: 1, b: 2 }
    2. const newObj = Object.assign({}, obj);

    二、深拷贝的常用方法

    1、JSON 对象的方法

    1. const obj = { a: 1, b: 2, c: { d: 3 } }
    2. const str = JSON.stringify(obj);
    3. const newObj = JSON.parse(str);
    4. obj.c.d = 4;
    5. console.log(newObj);
    缺点：JSON 的方法不能处理数据中的 undefined 和 function。

    2、封装递归的函数

    1. function deepClone (data) {
    2. // 先判断传入的data是否为 object ，否则直接return data
    3. if (typeof (data) === "object") {
    4.   // 定义新对象，用于存放深拷贝后的对象
    5.   const newData = {}
    6.   // 遍历传入的对象
    7.   for (const key in data) {
    8.     // 如果传入的data里面还嵌套了对象，就需要使用递归一直循环进入if
    9.     newData[key] = deepClone(data[key])
    10.   }
    11.   return newData
    12. }
    13. return data
    14. }
    15. const newObj = deepClone(obj)
    16. const obj = {
    17. a: 1, b: 2, c: { d: 3 }
    18. }
    19. obj.c.d = 4;
    20. console.log(obj, newObj); // {a: 1, b: 2, c: {d: 4}} {a: 1, b: 2, c: {d: 3}}
    21. console.log(obj === newObj); // false