ES6 数组的扩展

Posted 2020-10-25 王汉炎

Array.of()函数，将一组值，转换成数组。

    Array.of(1,2,3,4,5);
    //结果：[1,2,3,4,5]

Array.from( )函数，可以将类似数组的对象或者可遍历的对象转换成真正的数组。

有哪些是类似数组的对象？最常见的就是调用getElementsByTagName方法得到的结果

    let ele = document.getElementsByTagName(‘a‘);
    ele instanceof Array;  //结果：false，不是数组
    ele instanceof Object; //结果:true，是对象

    Array.from(ele) instanceof Array;
    //结果：true，是数组

Array.from函数其中一个用处就是将字符串转换成数组。

    let str = ‘hello‘;
    Array.from(str);
    //结果：["h", "e", "l", "l", "o"]

find( )函数，找出数组中符合条件的第一个元素

    let arr = [1,2,3,4,5,6];
    arr.find(function(value){
        return value > 2;
    });
    //结果：value=3

find()函数的参数是一个匿名函数，数组的每个元素都会进入匿名函数执行，直到结果为true，find函数就会返回value的值：3。倘若所有元素都不符合匿名函数的条件，find( )函数就会返回undefind。

    let arr = [1,2,3,4,5,6];
    arr.find(function(value){
        return value > 7;
    });
    //结果：undefined

findIndex( )函数：返回符合条件的第一个数组成员的位置。

    let arr = [7,8,9,10];
     arr.findIndex(function(value){
         return value > 8;
     });
    //结果：2

 上面的代码结果是：2，因为数组元素中大于8的元素是9，而元素9的位置正式2，（数组元素是从0算起）。倘若所有元素都不符合匿名函数的条件，findIndex( )函数就会返回-1。

 

fill( )函数：用指定的值，填充到数组。

    let arr = [1,2,3];
    arr.fill(4);
    //结果：[4,4,4]

经过fill( )函数处理后的数组arr已经变成了[4,4,4]；正如函数名fill（填充）一样。所有元素都被填充为数字4了。如果我想只填充部分元素可不可以呢？可以的，fill( )函数提供了一些参数，用于指定填充的起始位置和结束位置。

        还是上面的案例，我们稍做调整，再演示一下：

    let arr = [1,2,3];
    arr.fill(4,1,3);
    //结果：[1,4,4]

 上面的代码中第2个参数和第3个参数的意思是：从位置1的元素开始填充数字4，截止到位置3之前，所以是位置1和位置2的元素被数字4填充了，得到的结果：[1,4,4]。