JavaScript中的深浅拷贝

深浅拷贝 也叫 深浅复制

     与 引用数据类型 的复制相关的
     对象和数组的复制

     浅拷贝 
     通常意义上,对 数组和 对象的 复制
     浅拷贝的特点:只是简单的复制拷贝 引用数据类型的地址
              地址相同的变量,操作引用数据类型,彼此都会有影响

     深拷贝
     完整的复制拷贝 一个引用数据类型中的数值数据,到另一个引用数据类型中
     两个变量 是两个的独立的引用数据类型 是两个独立的存储空间
     一个变量操作 引用数据类型 不会影响另一个变量


    let arr1 = [1,2,3,4,5];

    这样的语法就是浅拷贝
    执行原理:
    此时是 赋值 arr1 中 存储的 数组的 内存地址
    arr2 和 arr1 中存储的是相同的内存地址 ,指向的是一个相同的数组
    如果 arr1 或者 arr2 对 这个数组做出修改,都会影响另一个变量的输出

    let arr2 = arr1;

    通过arr2,来修改数组,执行之后
    arr2[0] = '北京';

   console.log(arr1);
   console.log(arr2);


     深拷贝
     通过循环遍历,获取 arr3中的所有数值,复制拷贝在arr4中
     此时 arr4 与 arr3 虽然数值相同,但是是两个独立的引用数据类型,是两个独立的空间
     此时 arr4或者arr3,修改数据,不会对另一个引用数据类型造成影响

    let arr3 = [1,2,3,4,5];

    let arr4 = [];

    arr3.forEach(function(item){
        arr4.push(item);
    })

    arr4[0] = '北京';

    console.log(arr3);
    console.log(arr4);

    关键问题是 多维数组,或者是对象中存储对象数组等
    也就是引用数据类型中,再次存储引用数据类型

    数组中嵌套数组,不能只是单间的复制拷贝数组的地址,必须再次解析数组中的具体数值
    还必须再按照原有的嵌套方式,将结构 拷贝至 新的引用数据类型
    原生JavaScript中用递归函数来实现解决
    let arr5 = [ 1,2,3,[4,5,6,[7,8,9,[10,11,12]]]]

     在jQuery中,提供了,专门的方法来实现 深浅拷贝/深浅复制

     $.extend()方法

     将对象2,对象3,等之后的引用数据类型,拷贝复制到 对象1中
    
     语法形式1: $.extend( 是否深拷贝(不写) ,  对象1,对象2,对象3...) 
             执行的是浅拷贝
     语法形式2: $.extend( 是否深拷贝(true) ,  对象1,对象2,对象3...) 
             执行的是深拷贝

    使用 extend()方法来 完成 拷贝 
    对于 复制内容 来说 ,如果是字符串等 基本数据类型,不会被影响,被修改

   对于 复制内容 来说 ,如果是应用数据类型中的数据,要考虑是否要执行深浅拷贝

   键名相同的 复制拷贝 , 后面的数据会覆盖之前的数据,是重复赋值的效果

    小demo：

    var obj1 = { name1:'张三1',age1:18 , sex:'男'};
    var obj2 = { name2:'张三2',age2:19 , sex:'女',data:{time:123} };

    没有写第一个参数true,是浅拷贝
    $.extend(obj1,obj2);

    有第一个参数true,是深拷贝
    $.extend(true ,obj1,obj2 );

     基本数据类型中的数值,不会影响
    obj2.name2 = '李四';
    
    引用数据类型中的数值,会影响
    此时执行的是浅拷贝

    如果是深拷贝,不会印象obj1中的数据
    obj2.data.time = 456;

    console.log(obj1);
    console.log(obj2);