浅拷贝与深拷贝

浅拷贝

• 浅拷贝创建了一个新的对象或数组，但仅复制了顶层的属性或元素。对于嵌套的对象或数组，复制的仍然是引用。

Object.assign

Object.assign 是 JavaScript 中用于复制对象属性的一个方法。它可以用来实现浅拷贝

const target = {};
const source = { a: 1, b: { c: 2 } };

// 浅拷贝 source 到 target
Object.assign(target, source);

console.log(target); // { a: 1, b: { c: 2 } }

赋值操作

基本数据类型（Primitive Types）：

• 对于基本数据类型（如 number、string、boolean、undefined、null 和 symbol），赋值操作会创建一个新的值副本，因为基本数据类型是不可变的。

                例如：

let a = 10;
let b = a; // b 现在是 10，而 a 仍然是 10
b = 20;    // 修改 b 不会影响 a

对象和数组（Reference Types）：

• 对于对象和数组，赋值操作会将引用（指向内存中对象的地址）赋给新变量，而不是复制对象或数组本身。
• 例如：

let obj1 = { a: 1 };
let obj2 = obj1; // obj2 现在是 obj1 的引用
obj2.a = 2;     // 修改 obj2 也会影响 obj1，因为它们指向同一个对象

lodash.clone

        是 lodash 提供的浅拷贝方法，用于创建一个对象或数组的浅拷贝。它不会递归复制嵌套的对象或数组。

import _ from 'lodash';

const original = { a: 1, b: { c: 2 } };
const shallowCopy = _.clone(original);

console.log(shallowCopy); // { a: 1, b: { c: 2 } }

深拷贝

介绍

        当你进行深拷贝时，所有嵌套的对象和数组也会被复制，因此新对象或数组与原始对象或数组完全独立，新对象或数组的修改不会影响原始对象或数组

let original = { a: 1, b: { c: 2 } };
let deepCopy = _.cloneDeep(original); // 使用 lodash 的 cloneDeep 方法进行深拷贝
deepCopy.b.c = 3; // 修改 deepCopy 的嵌套对象不会影响 original
console.log(original) //{ a: 1, b: { c: 2 } }

手写深拷贝

        递归深拷贝的目的是创建一个新的对象或数组，该对象或数组的所有嵌套对象和数组都是新的副本，而不是引用原来的对象或数组。

function deepClone(obj){
    if(typeof obj !== "object" || obj === null){
        return obj
    }
    let res = obj instanceof Array ? []: {}
    for (let key in obj){
        //若是数组，key是索引
        if(obj.hasOwnProperty(key){
            res[key] = deepClone(obj[key])
        }
    }
    return res;
}
    
const obj1 = {
    name: '张三',
    age: 16,
    address: { city: '北京' },
    hobby: ['台球', '篮球']
};

const obj2 = deepClone(obj1);
console.log(obj2); // { name: '张三', age: 16, address: { city: '北京' }, hobby: [ '台球', '篮球' ] }
console.log(obj2 === obj1); // false