美文网首页
深浅拷贝 对象

深浅拷贝 对象

作者: Christoles | 来源:发表于2019-03-16 18:34 被阅读0次

先定义一个对象

var obj1 = {
    name:"bgg",
    age:12,
    skill:function(){
        console.log("333")
    },
    arr:["1","2","3"]
}

一、浅拷贝

var obj2 = obj1;
obj2.name = "奥巴马"
console.log("浅拷贝2:",obj2);//浅拷贝2: {name: "奥巴马", age: 12, skill: ƒ, arr: Array(3)}
console.log("浅拷贝1:",obj1);//浅拷贝1: {name: "奥巴马", age: 12, skill: ƒ, arr: Array(3)}

结果:原对象和拷贝后的对象都被修改了!


二、深拷贝

//用递归函数
function deepCopy(obj,newObj){
    for(var i in obj){
        if(typeof obj[i] == "object"){//数组和函数的typeof都是object
            newObj[i] = Array.isArray(obj[i])?[]:{};//判断类型 是数组or对象
            deepCopy(obj[i],newObj[i]);//递归
        }else{
            newObj[i] = obj[i];
        }
    }
    return newObj;
}
var newObj = {};//根据定义的递归函数,必须先声明个对象
var res = deepCopy(obj1,newObj);//调用函数
console.log("深拷贝原对象:",res)//深拷贝原对象:{name: "奥巴马", age: 12, skill: ƒ, arr: Array(3)}

//修改方法:
res.skill = function(){
    console.log("99999")
};
obj1.skill();//333
res.skill();//99999
//修改数组
res.arr[0] = "888";
console.log(obj1.arr);// ["1", "2", "3"]
console.log(newObj.arr);// ["888", "2", "3"]

结果:拷贝后的原对象没有被修改,而深拷贝出来的对象成功可修改!

相关文章

  • 对象深浅拷贝

    关于对象的深浅拷贝,个人有以下几点见解: 1.深拷贝和浅拷贝只针对像Object, Array这样的引用类型数据。...

  • 深浅拷贝 对象

    先定义一个对象 一、浅拷贝 结果:原对象和拷贝后的对象都被修改了! 二、深拷贝 结果:拷贝后的原对象没有被修改,而...

  • 对象深浅拷贝

    浅拷贝 深拷贝

  • 前端笔记(二) 对象的深浅拷贝,函数的防抖与节流,函数柯里化 ,

    对象的深浅拷贝 对象的深拷贝与浅拷贝的区别: 浅拷贝:仅仅复制对象的引用, 而不是对象本身。 深拷贝:把复制的对象...

  • js的深浅拷贝

    js的深浅拷贝可以分为数组的深浅拷贝和对象的深浅拷贝 一、数组的深浅拷贝如果只是简单的将数组中的元素付给另外一个数...

  • JS文集的目录

    js基础心法 深浅拷贝(递归)深浅拷贝(首层浅拷贝) js 数据处理 数组对象查找的常见操作数组对象去重的常见操作...

  • 深浅拷贝

    深浅拷贝 赋值操作,没有创建新对象浅拷贝,只拷贝第一份内容 [:] copy()浅拷贝,把这个对象的内容全部拷贝一...

  • 对象的深浅拷贝

    浅拷贝 深拷贝 方法1 方法2

  • JavaScript 对象深浅拷贝

    浅拷贝: 深拷贝:

  • 对象的深浅拷贝

    浅拷贝:只做一层拷贝,问题:如果对象的某个属性是引用类型,就会出现问题。深拷贝:遇到某一条属性是引用类型,也会拷贝...

网友评论

      本文标题:深浅拷贝 对象

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