深拷贝 浅拷贝 赋值的区别以及如何实现

实现深拷贝浅拷贝的方法： 

深拷贝：JSON.parse() JSON.stringfy()

浅拷贝：Object.assign()数组的合并

1.深拷贝

将一个对象从内存中完成的拷贝一份出来，从堆内存中重新开辟一个新的区域存放数据。那么新拷贝出来的对象，不管是基本数据类型还是引用用数据类型，都不会对原对象有任何影响。

  // JSON实现深拷贝
        var obj = {
            name: '张三',
            arr: [1, 2, 3]
        }
     var newObj = JSON.parse(JSON.stringify(obj))
        newObj.name = '李四'
        console.log(obj)// {name: '张三', arr: Array(3)}
        console.log(newObj) //{name: '李四', arr: Array(3)}
//原数组没有影响
//如果改变arr呢？对象里面的对象
newObj.arr[0] = 3
console.log(obj)
// {name: '张三', arr: Array(3)}
//arr: (3) [1, 2, 3]
//name: "张三"
console.log(newObj)
// {name: '张三', arr: Array(3)}
//arr: (3) [3, 2, 3]
//name: "张三"

2.浅拷贝

相当于又创建了一个新对象，这个对象有着原始对象属性值的一份精确拷贝。也就是说，如果原始对象是基本数据类型，那么拷贝到就是基本数据类型的值，如果原对象是引用数据类型的话，那么拷贝的就是引用数据类型的内存地址，所以说，如果改变的是基本数据类型的值，那么新对象不受影响，如果改变的是引用数据类型的值，因为他们的地址值是一样的，所以新旧对象都会跟着变化.

// 浅拷贝oject.assign()
        let a = {
            age: 18,
            sex: 'man',
            sports: ['socker', 'football', 'running']
        }
        let b = Object.assign({}, a)
        console.log(a)
        console.log(b)
//此时ab输出值是完全一样的，b拷贝了a的值

===
//然后对a的age进行改变，会发现b根本不受影响，依然是改变之前的值，因为age的值是基本数据类型
        a.age = 19
        console.log(a) //{age: 19, sex: 'man', sports: Array(3)}
        console.log(b)//{age: 18, sex: 'man', sports: Array(3)}
//接下来对a里面的对象sports进行修改，会发现a和b的值均改变，因为sports的值为引用数据类型
        a.sports[0] = 'sing'
        console.log(a)
//sports: (3) ['sing', 'football', 'running']
        console.log(b)
//sports: (3) ['sing', 'football', 'running']

3.赋值

也就是' = '的运用，如果原始对象是基本数据类型的话，改变基本数据类型的值对新对象没影响，如果是引用数据类型的话，改变引用数据类型的值，那么新对象也会跟着改变.

   // 赋值，obj1是引用数据类型，对原数据有影响，如果是基本数据类型赋值的话，没影响
         var obj1 = {
            name: '阿三',
             hobby: ['swim', 'sing', 'skip']
         }
         obj2 = obj1
         obj2.name = '汪汪队'
         console.log(obj1)
         console.log(obj2)

//基本数据类型
         let a = 10
         let b = a
         a = 100
         console.log(a)//100
         console.log(b) //10

 

基本数据类型：

Number String Boolean Null Undefind Symblo（es6）Bigint（es10）

引用数据类型：

Object Function Array RegExp Date

object.assign()对象的合并