深拷贝与浅拷贝的区别以及常用方式

深拷贝与浅拷贝的区别

浅拷贝拷贝引用类型时拷贝的是地址，深拷贝拷贝引用类型拷贝的是具体的数据值。

当直接把obj赋值给obj2时，修改obj2的引用类型的值,obj的引用类型的值也会受到影响。

  let obj = {

            name:'老虎',

            age:'18',

            hobby:['吃肉','睡觉']

        }

    //浅拷贝
    let obj2 = obj
    obj2.hobby[0] = '喝水'
    console.log(obj)
    console.log(obj2)

通过深拷贝方式将obj赋值给obj2时，修改obj2的引用类型的值,obj的引用类型的值不会受到影响。

     let obj = {
            name:'老虎',
            age:'18',
            hobby:['吃肉','睡觉']
        }
        //深拷贝
        let obj2 = JSON.parse(JSON.stringify(obj))
        obj2.hobby[0] = '喝水'
        console.log(obj)
        console.log(obj2)

深拷贝和浅拷贝常用的方式总结

1.浅拷贝常用方式

(1) 直接赋值

  let obj = {
            name:'老虎',
            age:'18',
            hobby:['吃肉','睡觉']
        }
        let obj2 = obj

(2)Object.assign(目标对象，源对象)

 let obj = {
            name:'老虎',
            age:'18',
            hobby:['吃肉','睡觉']
        }
        let obj2 = {}   //创建一个空对象
        Object.assign(obj2,obj)   // 将obj的值复制给obj2

2.深拷贝常用方式

(1)通过JSON转换完成深拷贝

 let obj = {
            name:'老虎',
            age:'18',
            hobby:['吃肉','睡觉']
        }
        let obj2 = JSON.parse(JSON.stringify(obj))  //JSON转换实现深拷贝

(2)通过lodash库完成深拷贝

<script src="./lodash.js"></script>  <!-- 引入lodash库 -->
    <script>
        let obj = {
            name:'老虎',
            age:'18',
            hobby:['吃肉','睡觉']
        }
        let obj2 = _.cloneDeep(obj)   //使用lodash库的方法 cloneDeep

   </script>

tips:使用lodash的深拷贝方式一定要引入lodash.js文件

(3)通过递归完成深拷贝

 
 function deepClone(obj2,obj){    //obj2为要赋值的新对象    obj为原对象
            for(let key in obj){     //对象遍历    遍历obj 来 赋值给 obj2
                //如果原对象的key 为 数组   那么就递归赋值
                if(obj[key] instanceof Array){    
                    obj2[key] = []
                    deepClone(obj2[key],obj[key])
                }else if(obj[key] instanceof Object){
                 //如果原对象的key 为 对象  那么就递归赋值 
                    obj2[key] = {}
                    deepClone(obj2[key],obj[key])
                }else{     
                 //正常情况下  直接赋值               
                    obj2[key] = obj[key]
                }
            }
        }

        let obj = {
            name:'老虎',
            age:'18',
            hobby:['吃肉','睡觉']
        }
        let obj2 = {}
        deepClone(obj2,obj)   //调用函数