美文网首页
深浅拷贝

深浅拷贝

作者: 转移到CSDN名字丹丹的小跟班 | 来源:发表于2021-02-03 13:56 被阅读0次

    一直在上面栽跟头,今天总结下

    最常用的深拷贝方法

    1.Object.assign
    此方法是es6新推出来的方法,目的是将所有可枚举属性的值从一个或多个源对象分配到目标对象
    Object.assign(目标对象, 源对象)该方法参数可以有一个,或者是对个

    • 参数为一个时且为一个对象时,该方法会返回该对象
    • 参数为多个时,且参数都为对象,该方法会将源对象上的属性添加(重复的属性后面的对象会覆盖前面对象的属性)到目标对象。不会改变源对象。
    //注意目标对象不能为null或undefined
    Object.assign(null);       // TypeError: Cannot convert undefined or null to object
    Object.assign(undefined);  // TypeError: Cannot convert undefined or null to object
    //当参数为一个且不为对象时,会将值转换为对象返回
    Object.assign(3);         // Number {3}
    typeof Object.assign(3);  // "object"
    //当参数不止一个时,null 和 undefined 不放第一个,即不为目标对象时,会跳过 null 和 undefined ,不报错
    Object.assign(1,undefined);  // Number {1}
    Object.assign({a: 1},null);  // {a: 1}
    Object.assign(undefined,{a: 1});  // TypeError: Cannot convert undefined or null to object
    //当为数组时,会将数组先转换为对象,将下标转换为键,然后进行对象合并
    Object.assign([2,3], [5]);  // [5,3]
    
    注意:assign 的属性拷贝是浅拷贝(踩过的深坑)

    2.无意中看到一种方法,效果与assign一样,只能实现一级拷贝

    let obj1 = {name: 'dandan', love: {car: '宝马', food:'西瓜'}}
    let obj2 = {...obj1}
    obj1 == obj2  //false
    obj1.name = 'fufu'
    console.log(obj1) // {name: 'fufu', love: {car: '宝马', food:'西瓜'}}
    console.log(obj2)// {name: 'dandan', love: {car: '宝马', food:'西瓜'}}
    obj1.love.food = '草莓'
    console.log(obj1)// {name: 'fufu', love: {car: '宝马', food:'草莓'}}
    console.log(obj2)// {name: 'dandan', love: {car: '宝马', food:'草莓'}}
    

    3.JSON.parse(JSON.stringify())的深拷贝
    虽然这种方法可以成功实现嵌套属性的深拷贝,但是也有许多弊端。

    1. JSON.stringify()方法将对象转化为字符串,但只会处理简单属性和简单属性数组,constructor属性丢失了
    2. 如果obj里面有时间对象,则JSON.stringify后再JSON.parse的结果,时间将只是字符串的形式,而不是对象的形式。
    3. 如果obj里有RegExp(正则表达式的缩写)、Error对象,则序列化的结果将只得到空对象;
    4. 如果obj里有函数,undefined,则序列化的结果会把函数或 undefined丢失;
    5. 如果obj里有NaN、Infinity和-Infinity(正无穷和负无穷),则序列化的结果会变成null。
    6. 如果对象中存在循环引用的情况也无法正确实现深拷贝;

    4.自定义对象数组深拷贝

    function deepClone(obj) {
      if (typeof obj !== "object") {
        return "克隆的值不是对象哦";
      }
      //判断拷贝的要进行深拷贝的是数组还是对象,是数组的话进行数组拷贝,对象的话进行对象拷贝
      var objClone = Array.isArray(obj) ? [] : {};
      for (key in obj) {
        if (obj.hasOwnProperty(key)) {
          if (typeof obj[key] === "object" && obj[key] !== null) {
            objClone[key] = deepClone(obj[key]);
          } else {
            objClone[key] = obj[key];
          }
        }
      }
      return objClone;
    }
    

    相关文章

      网友评论

          本文标题:深浅拷贝

          本文链接:https://www.haomeiwen.com/subject/bjoetltx.html