javaScript中的浅拷贝和深拷贝

一. 理解

        1.浅拷贝：浅拷贝只是拷贝一层，更深层次对象级别的只拷贝引用，它与原来的对象指向同一个堆内存地址，两者相互影响（藕断丝连），例如数组和对象的赋值。

        2.深拷贝：拷贝多层，每一级别的数据都会拷贝。我的理解是独立开辟一块新的内存地址，将原来对象中的各个属性逐一复制进去；对拷贝对象和源对象各自的操作互不影响。

二.浅拷贝的实现应用

      案例一：数组拷贝

        

      当修改arr1数组时，arr2也会被修改，因为 他们共享同一块内存地址：

        

      案例二：对象赋值

        

      运行结果：

        

 Object.assign()

            语法：

         

         作用：将obj1的值追加到obj2中；若对象里的属性名相同，则被覆盖

 案例三：

        

运行结果：

        

三.深拷贝

        1.迭代递归

                        遍历原对象，判断每个属性值的数据类型：如果只有一层（简单的数据类型），直接赋值；如果是复杂数据类型（数组，对象），先判断属于那种复杂数据类型，再递归调用，进行赋值操作。

               

 运行结果：

        

2.Array的slice和concat方法

        Array的slice和concat方法不修改原数组，只会返回一个浅复制了原数组中的元素的一个新数组。它看起来像是深拷贝，实际是浅拷贝。

3.通过jQuery.的$.extend()方法实现深拷贝

               调用$.extend(true,{},原对象)就可以实现深拷贝

                

        但jQuery的这个$.extend()方法，无法处理源对象内部循环引用，直接报了栈溢出：