web前端--深拷贝和浅拷贝

一、基本类型和引用类型

1.基本类型

string（字符串）,number（数字）,boolean（布尔）,null（空）,undefined（未定义）,symbol,biglnt(ES6)

2.引用类型

Function（函数）,Array（数组）,Object（对象）

二、深拷贝和浅拷贝

1、概念

浅拷贝 ：只复制指向某个对象的指针，而不复制对象本身，相当于是新建了一个对象，该对象复制了原对象的指针，新旧对象还是共用一个内存块（藕断丝连）

深拷贝：是新建一个一模一样的对象，该对象与原对象不共享内存，修改新对象也不会影响原对象（互不影响）

*技巧：针对一维数组和对象可以看作深拷贝，多维的可以看作是浅拷贝（解构赋值）

             数组与对象的赋值都叫做浅拷贝

2、代码（深拷贝）

① 

let list = [{id：1,stuName:"小张"},
            {id：2,stuName:"小王"},
            {id：3,stuName:"小二"},
           ]
let newlist = JSON.parse(JSON.stringify(list);
newlist.push({id:000})
console.log(list,newlist)

②标准的深拷贝（引用数据类型）

    function deepClone(source){
        const targetObj = source.constructor === Array ? []:{};
        for(let keys in source){
            if(source.hasOwnProperty(keys)){
                // keys => 3(基本，对象，数组)
                // 引用数据类型
                if(source[keys]&&typeof source[keys]==='object'){
                    targetObj[keys] = source[keys].constructor === Array ? []:{};
                    // 递归
                    targetObj[keys] = deepClone(source[keys])
                }else{
                    //基本数据类型，直接赋值
                    targetObj[keys] = source[keys];
                }
            }
        }
        return targetObj
    }
    let objc = {
        ff:'name',
        obj:{str:'222',age:10},
        arr:[1,2,3]
    }
    let newobjc = deepClone(objc);
    newobjc.ff = '1111';
    newobjc.arr.push ("lalalaa");