手写源码之--深拷贝与浅拷贝

36 阅读2分钟

区分赋值与拷贝

这叫对象赋值
改变内存中的值,所有的引用一起改
在这里插入图片描述

这叫浅拷贝
可以复制一层基本类型
在这里插入图片描述
浅拷贝实现

// 方法一:
const newObj = {...obj}

//方法二:
const newObj = Object.assgin({},obj)

//方法三:
const newObj = Object.creact({},obj)

浅拷贝:复制一个对象,如果属性是基本类型,拷贝的就是基本类型的值,如果属性是引用类型,拷贝的就是内存地址
**深拷贝:**将一个对象从内存中完整的拷贝一份出来,从堆内存中开辟一个新的区域存放新对象,且修改新对象不会影响原对象

深拷贝之 JSON.parse(JSON.stringify())

创建一个对象
在这里插入图片描述
拷贝它
在这里插入图片描述
改变原对象
在这里插入图片描述
新对象未被改变,此为深拷贝
这种方法的缺陷是不能拷贝undefine null 正则 函数等

二 深拷贝之递归遍历

// 定义一个深拷贝函数  接收目标target参数
function deepClone(target) {
    // 定义一个变量
    let result;
    // 如果当前需要深拷贝的是一个对象的话
    if (typeof target === 'object') {
    // 如果是一个数组的话
        if (Array.isArray(target)) {
            result = []; // 将result赋值为一个数组,并且执行遍历
            for (let i in target) {
                // 递归克隆数组中的每一项
                result.push(deepClone(target[i]))
            }
         // 判断如果当前的值是null的话;直接赋值为null
        } else if(target===null) {
            result = null;
         // 判断如果当前的值是一个RegExp对象的话,直接赋值    
        } else if(target.constructor===RegExp){
            result = target;
        }else {
         // 否则是普通对象,直接for in循环,递归赋值对象的所有值
            result = {};
            for (let i in target) {
                result[i] = deepClone(target[i]);
            }
        }
     // 如果不是对象的话,就是基本数据类型,那么直接赋值
    } else {
        result = target;
    }
     // 返回最终结果
    return result;
}

创建一个对象用此函数进行拷贝
在这里插入图片描述

改变原对象,新对象未被改变
在这里插入图片描述
并且拷贝的很完整
在这里插入图片描述

有想换工作的同学可以找我内推哦不低于15k(前端,java,测试)

在这里插入图片描述