js深浅拷贝个人笔记-CSDN博客

本文链接：https://blog.csdn.net/yh8899abc/article/details/125221019

浅拷贝

...Es6展开运算符
concat() 数组合并
slice() 对象/数组
Object.assign() 对象的合并

首层浅拷贝

const shallowClone = ((targetArray) => {
    const result = targetArray.constructor === Array ? []: {}; // 判断复制的目标是数组还是对象
    for (let keys in targetArray) {
        if (targetArray.hasOwnProperty(keys)) {
            result[keys] = targetArray[keys];
        }
    }
    return result;
});

深拷贝

方案一 JSON.parse(JSON.stringify())

const target = {
	a: 1,
	b: 2,
};
const result = JSON.parse(JSON.stringify(target));

注意：如果目标对象包含undefined、symbol、function 这个方法不适应，原因是在转换过程中产生损耗，在编译过程中会被忽略

方案二递归

// 如果是存在引用拷贝
const alreadyArray = new Map();
const deepEVent = ((targetArray) => {
    const result = targetArray.constructor === Array ? [] : {}; // 判断复制的目标是数组还是对象
    for (let keys in targetArray) {
        // 是否存在引用对象，并且避免是引用类型数据 死循环调用
        if (targetArray.hasOwnProperty(keys) && !alreadyArray.get(targetArray[keys])) {
        	// 如果存在 且是复杂数据类型
            if (targetArray[keys] && typeof targetArray[keys] === 'object') {
            	// 使用Map记录该值已经存在
                alreadyArray.set(targetArray[keys], true);
                // 进入递归循环
                result[keys] = targetArray[keys].constructor === Array ? [] : {};
                result[keys] = deepEVent(targetArray[keys]);
            } else {
                result[keys] = targetArray[keys];
            }
        }
    }
    return result;
});