Array方法之Array.from（），附带对浅拷贝和深拷贝的理解

Array.from()

1. 作用：从一个类似数组或可迭代对象中创建一个新的，浅拷贝的数组实例。
   （1）：这里讲一下深拷贝和浅拷贝的区别
   浅拷贝：只复制指向某个对象的指针，而不复制对象本身，新旧对象还是共享同一块内存。
   深拷贝：会另外创造一个一模一样的对象，新对象跟原对象不共享内存，修改新对象不会改到原对象。
   此处加一句：浅拷贝的对象若包含子对象，当新的对象对子对象发生改变时则会使原对象子对象一同改变，若新的对象只改变第一层的数据，则源对象不会改变。
   换句话说：浅拷贝只是基础类型的拷贝，对于对象和数组只是复制其指针。而深拷贝是和源对象没有任何共享的，一般深拷贝通过循环遍历实现。

看一下效果

	var str = "this is string";
    var arr = Array.from(str);
    console.log("arr:",arr);
    //arr: [ 't', 'h', 'i', 's', ' ', 'i', 's', ' ', 's', 't', 'r', 'i', 'n', 'g' ]
    //从结果得知from方法默认将str（不知道怎么描述^_^）拆分、组合成一个新的数组实例。

证明他是一个浅拷贝：

    //浅拷贝和深拷贝是只针对object和Array这样的引用数据类型
   
    //我们用一个引用类型的实例看一下吧：
     var obj = new Object( {
         name:"web_sea",
         age:18,
         isRich:[false,true]
     })
     //将对象转成数组
     var objs = [];
       for(var i in obj){
        objs.push(obj[i]);
       }

     var arrObj = Array.from(objs);
     console.log("objs:",objs);//objs: [ 'web_sea', 18, [false,true] ]
     console.log("arrObj:",arrObj);//arrObj:[ 'web_sea', 18, [false,true] ]
	  //我们要改变objs子对象的值；
     objs[2][0]=true;
     //改变第一层数据的值
     objs[1]=50;
     console.log("改变objs后objs:",objs);//[ 'web_sea', 50, [ true, true ] ]
     console.log("改变objs后arrObj:",arrObj);//arrObj:[ 'web_sea', 18, [ true, true ] ]

     //再来一个例子
     var arrs = new Array();
     arrs = [{name:"websea",age:[18,19]},30];
     var arrsFrom = Array.from(arrs);
    
     console.log("arrs:",arrs);//arrs: [ { name: 'websea', age: [ 18, 19 ] },30 ]
     console.log("arrsFrom:",arrsFrom);//arrsFrom: [ { name: 'websea', age: [ 18, 19 ] },30 ]
  
     //现在我们要改变arrsFrom的子对象的值；
     arrsFrom[0].age=[20,21];
     arrsFrom[1] = 40;
    
     console.log("arrsFrom:",arrsFrom);//arrsFrom: [ { name: 'websea', age: [ 20, 21 ] }, 40 ]
     console.log("arrs:",arrs);//arrs: [ { name: 'websea', age: [ 20, 21 ] }, 30 ]
    
     //看见没，arrs的子对象的值改变了但是第一层数据并没有改变。这符合我们对于浅拷贝的定义。
    

2. 语法：Array.from(arrayLike[, mapFn[, thisArg]])
   参数：
   arrayLike :想要转换成数组的伪数组对象或可迭代对象。
   mapFn(可选参数)：如果指定了该参数，新数组中的每个元素会执行该回调函数。
   thisArg(可选参数)：执行回调函数mapFn时的this对象
   返回值：
   一个新的数组实例
   举个栗子

	var aas = "123";
    var arrfun = Array.from(aas,i=>i*2);
    console.log("arrfun:",arrfun);//arrfun: [ 2, 4, 6 ]

博客写的不多还是萌新，写的不对的地方还请大佬指出，大家一起加油吧！！！