JS深浅拷贝

浅拷贝

只能拷贝一层对象

常用的浅拷贝方法：

1. concat
数组

const arr = [1,2,3];
let newArr = arr.concat();
newArr[0] = 5;
console.log(arr);
console.log(newArr);

2.slice
数组

const arr = [1,2,3];
let newArr = arr.slice();
newArr[0] = 5;
console.log(arr);
console.log(newArr);

3. 扩展运算符
数组和对象

const arr = [1,2,3];
let newArr = [...arr];
newArr[0] = 5;
console.log(arr);
console.log(newArr);

4. Object.assign
第一个参数是目标对象，第二个参数是源对象。

const arr = {
    name: 'xiaobai',
    age: '21'
};
let newArr = Object.assign({},arr,{name: 'huang'});
console.log(newArr);

5. 手动实现
思路：遍历对象，把源对象的属性和属性值放在一个新对象。
一些小细节：

• 源对象只能是对象或数组
• 判断源对象是数组还是对象，生成新对象或数组

const shallowClone = target => {
    if (typeof target === 'object' && target !== null) {
        let newTarget = Array.isArray(target) ? [] : {}
        for(let i in target) {
            if(target.hasOwnProperty(i)) {
                newTarget[i] = target[i];
            }
        }
        return newTarget;
    }
    return target;
}

深拷贝

解决无限极的对象嵌套问题，实现彻底的拷贝

常用的深拷贝方法：

1. JSON.parse(JSON.stringify());
大多数情况用这个

2. 手动实现

简单版：
思路：
在进行拷贝的时候，判断属性值是否是对象，如果是则递归调用深拷贝函数。

const deepClone = target => {
    if(typeof target === 'object' && target !== null) {
        let newTarget = Array.isArray(target) ? [] : {};
        for(let key in target) {
            if(target.hasOwnProperty(key)) {
                newTarget[key] = typeof newTarget[key] === 'object' ? deepClone(newTarget[key]) : target[key];
            }
        }
        return newTarget;
    }
    return target;
}