数据存储问题复习

数据存储问题复习

之前做过数据类型的复习，牵扯到基本数据类型和引用数据类型，在复习时联想到了数据的存储问题（栈内存和堆内存），基于引用数据类型又引申出深拷贝和浅拷贝的问题，因此另开一篇进行阐述

1.栈内存和堆内存

通俗来讲，基本数据类型的数据存放在栈内存中，像函数的变量、参数等等，栈内存内的存储的变量在超出其作用域后会被自动释放。引用类型的数据存放在堆内存中，但引用数据类型的数据也会在栈内存中存储，只不过存储的是该数据在堆内存中的地址
通过这张图可以帮助我们理解两种数据类型存储的不同

图中a,b都是基本数据类型，c为引用数据类型，当把a的值传给b，再将b的值变为2，a和b在栈内存中是独立的两个变量，a的值不受影响。
但是，引用数据类型不行！！引用数据类型在栈内存中存储的是引用地址，将c直接复制给d，相当与将d也指向了c的地址，c和d相当于同一地址的两个不同指针，此时改变d中的属性值，c也会受到影响，这就是我们常说的传值与传址的区别

2.深拷贝与浅拷贝

了解了传址后，就牵扯到了浅拷贝与深拷贝。
什么是浅拷贝，即通过遍历对象的方式，将一个对象中的属性和方法复制到一个新的对象中。

        let oldObj = {
            a: 1,
            b: 2,
            c: ['a', 'a', 'a', 'a', 'a', 'a', 'a']
        }
        let newObj = {}
        for (let k in oldObj) {
            newObj[k] = oldObj[k]
        }
        newObj.c.push('b')
        console.log(oldObj.c)

浅拷贝的问题就是，当被拷贝对象存在引用数据类型时，通过=直接进行复制，只是进行传址，并没有开辟新的内存空间，修改新对象的该属性值时，被拷贝对象的该属性值也会受到影响
es6新增的方法Object.assign()也可以实现对象的浅拷贝（语法糖）
Object.assign(target，obj) target是目标对象，即要拷贝给谁；obj是源对象，即谁被拷贝，可以传多个
深拷贝
可以利用函数递归实现深拷贝，即遍历时进行判断，对引用数据类型的属性再次进行遍历复制，开辟新的内存空间，避免相互之间的干扰

        function deepClone(oldObj) {
        let newObj = Array.isArray(oldObj)?[]:{}
            for (let k in oldObj) {
                let item = oldObj[k]
                if (item instanceof Array) {
                	newObj[k] = []
                    deepClone(newObj[k], item)
                } else if (item instanceof Object) {
                	newObj[k] = {}
                    deepClone(newObj[k], item)
                } else {
                    newObj[k] = oldObj[k]
                }
            }
            return newObj
        }

但是递归存在爆栈问题，后续解决方法待补充
还可以利用JSON进行拷贝，但该方法会忽略对象内的方法
newObj = JSON.parse(JSON.stringify(oldObj))