深拷贝与浅拷贝

---

前言

今天无意看到一位同学说：concat返回一个新数组，可以实现数组的深拷贝，就亲自试了试！！！

---

简单的测试代码

	// 数组arr1中第一个元素为引用类型
    const arr1 = [{hobby:"看美女"}]
    const arr2 = [1,2]
    const newArr = arr1.concat(arr2)
    // newArr 此时为 [{hobby:"看美女"},1,2]
    newArr[0].name = '看动漫'
    console.log(newArr)
    console.log(arr1)

结果很显然，如果源数组中的元素为引用类型的话，新数组中的此元素和源数组中的此元素指向同一个内存地址，一变都变。如果源数组中都是基本数据类型的话，才可以说concat可以实现数组的"深拷贝"吧

一、简单理解一下浅拷贝和深拷贝？

浅拷贝：创建了一个新对象，这个对象中有着和原始对象属性值的相同的一份数据。
**** 如果属性值是基本类型，拷贝的就是基本属性的值
**** 如果属性值是引用类型，拷贝的就是属性的内存地址，如果其中一个对象改变了，就会影响到另一个对象

深拷贝：将一个对象从内存中完整的拷贝一份出来，从堆中开辟一块新的地址存放新对象，修改新对象不会影响源对象

二、深浅拷贝的实现方式

1.浅拷贝的常用实现方式

1、Object.assign(目标对象,源对象)
2、…扩展运算符
3、还可以写个浅拷贝函数实现：如下

function shallowClone(obj){
    if(obj === 'null' || typeof obj !== 'object') return
    let newObj = {}
    for (let key in obj) {
        if (obj.hasOwnProperty(key)) {
            newObj[key] = obj[key];
        }
    }
    return newObj;
}

2.深拷贝的常用实现方式

1、JSON.stringify(JSON.parse(obj))
2、通过JQuery的方法 $.extend(true,target,object1,…objectN) // 第一个参数必须是true,将后面全部对象深度拷贝到target身上
3、递归函数：如下

function deepClone(obj,newObj){
    for (let key in obj) {
        if (obj.hasOwnProperty(key)) {
            if(obj[key] instanceof Array){
                newObj[key] = []
                deepClone(obj[key],newObj[key])
            }else if(obj[key] instanceof Object){
                newObj[key] = {}
                deepClone(obj[key],newObj[key])
            }else {
                newObj[key] = obj[key];
            }
        }
    }
    return newObj;
}