当前位置: 代码迷 >> 综合 >> 关于 assign 的克隆问题与解决办法(深复制与浅复制)
  详细解决方案

关于 assign 的克隆问题与解决办法(深复制与浅复制)

热度:15   发布时间:2023-11-21 18:40:13.0

目录

Object.assign

解决:

一、使用 JSON复制

二、loadsh的深复制

三、使用 Jquery中 extend

四、工具类简单比较


Object.assign

关于使用Object.assign复制时,对于引用类型里存放引用类型时,此时里面存放引用类型是浅复制。具体事例看测试:

var obj={a:1,b:{name:"cc"}}var cloneObj=Object.assign({},obj); obj.a=2;cloneObj.a  //1  对于基本数据类型则是深复制obj.b.name="wcc";
cloneObj.b.name //wcc 对于引用类型则是浅复制(引用地址)//数组
var arr=[1,{age:12}]
var cloneArr=Object.assign([],arr);
arr[0]=3;
cloneArr[0] //1
arr[1].age=15;
cloneArr[1].age //15  

解决:

一、使用 JSON复制

var obj={a:1,b:{name:"cc"}}var cloneObj=JSON.Stringify(obj)
cloneObj=JSON.Parse(cloneObj) obj.b===cloneObj.b  //false

 该方法有局限性:

  • 会忽略 undefined
  • 不能序列化函数
  • 不能解决循环引用的对象
let person = {age: undefined,work: function() {},name: 'cc'
}
let p = JSON.parse(JSON.stringify(person))
console.log(p) // {name: "cc"}

二、loadsh的深复制

var objects = [{ 'a': 1 }, { 'b': 2 }];var deep = _.cloneDeep(objects);
console.log(deep[0] === objects[0]);

三、使用 Jquery中 extend

var obj={a:1,b:{name:"cc"}}var cloneObj=$.extend(true,{},obj);obj.b===cloneObj.b  //false

四、工具类简单比较

const type=obj=>{const toString=Object.prototype.toString;const map={'[object Array]':'array','[object Object]':'object'};return map[toString.call(obj)]
}
const deepClone=data=>{const t=type(data);let o,i,length;if(t==='array'){//数组类型,新建数组o=[];for(i=0,length=data.length;i<length;i++){o.push(deepClone(data[i]))}return o;}else if(t==='object'){//新建对象o={};for(i in data){o[i]=deepClone(data[i])}return o;}else{//基本数据类型,直接返回return data}
}

以上是在项目中碰到的问题,与解决方案...fighting

  相关解决方案