JS赋值、浅拷贝和深拷贝

赋值

赋值：
当我们把一个对象赋值给一个新的变量时，赋的其实是该对象在栈中的地址，而不是堆中的数据。
也就是两个对象指向同一个内储存空间，无论哪个对象发生改变，其实都是改变储存空间的内容，因此两个对象是联动的

<script>
var person = {
        name : 'Tom',
        hobby:['学习','打球']
    }
    console.log(person)
    var person1 = person
    person1.name = "Pat"
    person.hobby[0] = '读书'
    console.log(person)//person和person1的输出相同
    console.log(person1)
</script>

浅拷贝

浅拷贝：
如果拷贝的对象是基本数据类型，那么拷贝的就是基本类型的值
如果拷贝的对象是引用数据类型，那么拷贝的就是内存地址
重新在堆中创建内存，拷贝前后对象的基本数据类型互不影响，但拷贝前后对象的引用类型因共享一块内存，会互相影响

<script>
var person = {
        name : 'Tom',
        hobby:['dushu','打球']
    }
    //浅拷贝函数
    function shallowCopy (obj) {
        var perObj = new Object()
        for(var i in obj){
            if (obj.hasOwnProperty(i)){

                perObj[i] = obj[i]
            }
        }
        return perObj
    }
    //最终输出基本数据类型是不同的，但引用数据类型是相同
    //改变person1的基本数据类型的数据person的基本数据类型数据不会发生改变
    //改变person1的引用数据类型的数据person的引用数据类型的数据还是会发改变
    var person1 = shallowCopy(person)
    person1.name = 'Pat'
    console.log(person)
    console.log(person1)
    person1.hobby[0] = 'Play'
    console.log(person)
</script>

深拷贝

深拷贝：
从堆内存中开辟一个新的区域存放新对象，对对象中的子对象进行递归拷贝，拷贝前后两个对象互不影响
也就是说改变person1中任何数据，person中的数据都不会随之改变

<script>
   var person = {
        name : 'Tom',
        hobby:['读书','打球']
    }
    //深拷贝函数
    function deepClone (obj) {
        var cloneObj = new Object()
        for (var i in obj){
            if(obj.hasOwnProperty(i)){
                //判断obj[i]是否为对象，如果是，递归复制
               if(obj[i] && typeof obj[i] === 'object'){
                   cloneObj[i] =deepClone(obj[i])
               }else{
                   cloneObj[i] = obj[i]
               }
            }
        }
        return cloneObj
    }
    var person1 = deepClone(person)
    person1.name = 'Pat'
    person1.hobby[0] = 'play'
    console.log(person)
    console.log(person1)
</script>