深拷贝与浅拷贝

147 阅读1分钟

浅拷贝

当拷贝的对象是基础数据类型时,拷贝的是值.修改后对原数据没有影响.但是当拷贝的对象是复杂数据类型时,拷贝的知识存储在栈中的地址.修改会对原数据有影响.

拷贝复杂数据类型时,拷贝的是地址.

var data = {
        name:"test",  //一会要被拷贝的数据,包含字符串、对象、函数、数组
        main:{
            a:1,
            b:2
        },
        fn:function(){
            
        },
        friends:[1,2,3,[22,33]]
    }

    function shallowCopy(obj){
        var data = {};
        for (var i in obj){
            if(obj.hasOwnProperty(i)){  // for in  循环,也会循环原型链上的属性,所以这里需要判断一下
                data[i] = obj[i]
            }
        }
        return data
    }
    var obj2 = shallowCopy(data)
    obj2.name = '修改成功'    //由于name是基本数据类型,会开辟一个新的地址来储存我们拷贝的内容,所以原数据的name属性不会被修改
    obj2.main.a = 100    //   main是引用类型,浅拷贝会直接拷贝它的地址,所以原数据的这个值也会改变
   console.log(data,obj2)

深拷贝

当拷贝的对象是基础数据类型时,拷贝的是值.修改后对原数据没有影响.但是当拷贝的对象是复杂数据类型时,会在堆中新开辟一个空间,然后克隆.修改后对原数据没有影响.

拷贝复杂数据类型时,会新辟一个空间,然后拷贝数据.

image.png

一行代码实现:

let newObj = json.parse(json.stringify('要拷贝的对象'))