一文弄懂浅拷贝和深拷贝

一文弄懂浅拷贝和深拷贝

目的:复制一个对象

浅拷贝:复制基本类型的属性;引用类型的属性复制,复制栈中的变量 和 变量指向堆内存中的对象的指针,不复制堆内存中的对象。(修改拷贝对象中的应用类型属性值时,原对象也会随着变化

在这里插入图片描述

深拷贝:复制基本类型的属性;引用类型的属性复制,复制栈中的变量 和 变量指向堆内存中的对象的指针和堆内存中的对象。(修改拷贝对象中的应用类型属性值时,原对象不会随着变化

在这里插入图片描述

JS实现

浅拷贝

function clone(origin,target){
    
    
    var target = target || {
    
    };
    for(var key in origin){
    
    
        target[key] = origin[key];//直接赋值每一项
    }
    return target;
}

深拷贝(递归实现)

function deepClone(origin,target){
    
    
    var target = target || {
    
    },
        toStr = Object.prototype.toString,
        //Object.prototype.toString.call(origin[key]):判断对象类型
        arrType = '[object Array]';//数组类型
    //遍历每一个属性
    for(var key in origin){
    
    
        //判断是否是prototype上的属性
        if(origin.hasOwnProperty(key)){
    
    
            //不是原型上的
            if(typeof(origin[key]) === 'object' && origin[key] !== null){
    
    
                //是引用类型
                if(toStr.call(origin[key]) === arrType){
    
    
                    //是数组
                    target[key] = [];
                }else{
    
    
                    //是对象
                    target[key] = {
    
    };
                }
                //递归拷贝
                deepClone(origin[key],target[key]);
            }else{
    
    
                //对应key赋值
                target[key] = origin[key];
            }
        }
    }
    return target;
}

个人博客

我的博客

猜你喜欢

转载自blog.csdn.net/Twinkle_sone/article/details/108854997