美文网首页
前端小白必备资料之对象克隆篇

前端小白必备资料之对象克隆篇

作者: 野生羊腰子 | 来源:发表于2020-09-09 08:58 被阅读0次

对象的深浅克隆

对象的浅克隆

            var obj1 = { a : 10 };
            var obj2 = {};
            // 克隆 你有什么我有什么;
            // 先去找到原对象里面每一个项数据;
            for(var attr in obj1){
                  // 给克隆对象赋值每一个数据;
                  obj2[attr] =  obj1[attr]
            }
            obj1.a = 30;
            console.log(1,obj2);

通过遍历 将obj1中的数据克隆到obj2当中 这种克隆只能克隆到对象中的基本数据类型 也可以理解为 只能克隆到对象中的第一层 如果对象中还有对象那么使用此种克隆方式是无法实现完全克隆的

对象的深克隆

function clone(obj1,obj2){
  for(var name in obj1){
    if(typeof obj1[name] === "object"){ //先判断一下obj[name]是不是一个对象
      obj2[name]= (obj1[name].constructor===Array)?[]:{}; //我们让要复制的对象的name项=数组或者是json
      clone(obj1[name],obj2[name]); //然后来无限调用函数自己 递归思想
    }else{
      obj2[name]=obj1[name];  //如果不是对象,直接等于即可,不会发生引用。
    }
  }
  return obj2; //然后在把复制好的对象给return出去
}
var obj1={"name":"文杰","age":18,"arr1":[1,2,3],"string":'aaa',"arr2":[4,5,6],"arr3":[{"name1":"胡继"},{"job":"高级前端工程师"}]};
var obj2={};

res=clone(obj1,obj2)
console.log(res) 
/*age: 18
arr1: (3) [1, 2, 3]
arr2: (3) [4, 5, 6]
arr3: Array(2)
0: {name1: "胡继"}
1: {job: "高级前端工程师"}
length: 2
__proto__: Array(0)
name: "文杰"
string: "aaa"
__proto__: Object*/

此种是通过递归的方式,将对象进行深克隆,即如果对象中存在对象,如果存在对象将会克隆

相关文章

网友评论

      本文标题:前端小白必备资料之对象克隆篇

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