前端

深拷贝和浅拷贝的学习记录

铺垫知识：基本数据类型和引用数据类型

基本数据类型： undefined、null、number、string、boolean、symbool

引用数据类型：统称Object类型， 例如：Function、Array、Date、String、Number等

数据类型储存方式：

    1. 基本数据类型的变量名和值储存在栈内存中

let [a, b] = [1];
b = a    // 为b单独分配栈内存

栈

key	valie
a	1
b	1

    2. 引用数据类型的变量名储存在栈内存，值存于堆内存，栈中提供一个指向堆内存中的值的引用地址

let obj = {
    a: 1,
    c: { b: 2 } 
}

let newObj = obj
newObj.a = 2 
// newObj: {/ a: 2; c: { b: 2 } }
// obj: {/ a: 2; c: { b: 2 } }

浅拷贝：创建一个新的数据，这个数据有着原始数据属性的一份精确拷贝。如果属性是基本数据类型，拷贝的就是基本数据类型的值；如果是引用数据类型，拷贝的就是堆内存地址，所以改变其中一个数据的这个属性的地址，另一个值也会受到影响。

       缺点：只解决了第一层数据的问题，无法拷贝深层数据

深拷贝：拷贝对象所有的属性，并拷贝属性指向的动态分配的内存。拷贝后的对象与原对象相互分离互不影响。

深拷贝实现方式：

1. Object.assign()。该方式进行的是浅拷贝，拷贝的是对象的属性的引用，而不是对象本身。但对一层数据来说可以实现深拷贝；对于深层数据，

2. 递归实现

function deepClone (obj) {
    let result = Array.isArray(obj) ? [] : {}
    // for...in 遍历obj全部的可枚举属性，包括自身和圆形属性
    for (let key in obj) {
        if (obj.hasOwnProperty(key)) {
            // 包含自身属性
            if (obj[key] && typeof obj[key] === 'object') {
                result[key] = deepClone(obj[key])
            } else {
                result[key] = obj[key]
            }
        }
    }
    return result
}

3. JSON.parse(JSON.stringify(obj))： 可以实现深拷贝

缺点： 1， 会忽略undefined、symbol和函数

let obj = {
    name: 'wa kao',
    age: undefined,
    hobby: Symbol('hobby'),
    check: function () {}
}

let obj2 = JSON.parse(JSON.stringify(obj))

console.log(obj2)  // { name: 'wa kao' }

2. 对象循环引用时会报错

3. new Date的转换结果不正确