• ES6数组,及扩展方法


    数组

    1、创建数组

    //方式一
    var array=new Array();
    //方式二
    var array=[];
    

    转换成数组
    Array.of() 将参数中所有值作为元素形成数组。

    console.log(Array.of(1, 2, 3, 4)); // [1, 2, 3, 4]
     
    // 参数值可为不同类型
    console.log(Array.of(1, '2', true)); // [1, '2', true]
     
    // 参数为空时返回空数组
    console.log(Array.of()); // []
    

    Array.from() 将类数组对象或可迭代对象转化为数组。

    // 参数为数组,返回与原数组一样的数组
    console.log(Array.from([1, 2])); // [1, 2]
     
    // 参数含空位
    console.log(Array.from([1, , 3])); // [1, undefined, 3]
    
    //可选,map 函数,用于对每个元素进行处理,放入数组的是处理后的元素。
    console.log(Array.from([1, 2, 3], (n) => n * 2)); // [2, 4, 6]
    
    //可选,用于指定 map 函数执行时的 this 对象。
    let map = {
        do: function(n) {
            return n * 2;
        }
    }
    let arrayLike = [1, 2, 3];
    console.log(Array.from(arrayLike, function (n){
        return this.do(n);
    }, map)); // [2, 4, 6]
    

    数组的扩展的方法

    查找

    find() 查找数组中符合条件的元素,若有多个符合条件的元素,则返回第一个元素。

    let arr = Array.of(1, 2, 3, 4);
    console.log(arr.find(item => item > 2)); // 3
     
    // 数组空位处理为 undefined
    console.log([, 1].find(n => true)); // undefined
    

    findIndex() 查找数组中符合条件的元素索引,若有多个符合条件的元素,则返回第一个元素索引。

    let arr = Array.of(1, 2, 1, 3);
    // 参数1:回调函数
    // 参数2(可选):指定回调函数中的 this 值
    console.log(arr.findIndex(item => item == 2)); // 1
     
    // 数组空位处理为 undefined
    console.log([, 1].findIndex(n => true)); //0
    

    包含

    includes()表示某个数组是否包含给定的值,返回布尔值。

    [1, 2, 3].includes(2) // true
    [1, 2, 3].includes(4) // false
    

    填充

    fill() 将一定范围索引的数组元素内容填充为单个指定的值。

    let arr = Array.of(1, 2, 3, 4);
    // 参数1:用来填充的值
    // 参数2:被填充的起始索引
    // 参数3(可选):被填充的结束索引,默认为数组末尾
    console.log(arr.fill(0,1,2)); // [1, 0, 3, 4]
    

    copyWithin() 将一定范围索引的数组元素修改为此数组另一指定范围索引的元素。

    // 参数1:被修改的起始索引
    // 参数2:被用来覆盖的数据的起始索引
    // 参数3(可选):被用来覆盖的数据的结束索引,默认为数组末尾
    console.log([1, 2, 3, 4].copyWithin(0,2,4)); // [3, 4, 3, 4]
     
    // 参数1为负数表示倒数
    console.log([1, 2, 3, 4].copyWithin(-2, 0)); // [1, 2, 1, 2]
    console.log([1, 2, ,4].copyWithin(0, 2, 4)); // [, 4, , 4]
    

    遍历

    forEach

    var arr = ['我','和','我的','祖国'];
     arr.forEach(function(item,index,self){
     	console.log(item,index,self);
     })
    //箭头函数写法
    arr.forEach((item,index,self) => console.log(item,index,self))
    
    输出如下:
    我   0  ["我", "和", "我的", "祖国"]
    和   1  ["我", "和", "我的", "祖国"]
    我的 2  ["我", "和", "我的", "祖国"]
    祖国 3  ["我", "和", "我的", "祖国"]
    

    映射,即原数组映射成一个新的数组;map()

    var arr = [1,2,3];
    var arr2 = arr.map(function(item){
    	return item*2;
    })
    console.log(arr2)
    //[2,4,6]
    

    过滤 filter

    var arr1 = [1,2,3,4,5,6];
    var arr2 = arr1.filter(function(item){
    	return item>3;
    })
    console.log(arr2)
    //箭头函数
    var arr2 = arr1.filter(item=>{return item>3})
    console.log(arr2)
    ///[4,5,6]
    

    排序 sort()

     let arr = [2,1,3,5,4];
     arr= arr.sort((n1,n2)=>{
      return n1-n2;
      // n2 - n1  从大到小
      // n1 - n2  从小到大
            });  
      console.log(arr);
    //[1,2,3,4,5]
    

    每一个 every

    数组里面所有的元素都有符合条件,才返回true

    var arr = [1,2,3,9];
    var ret = arr.every(function(item){
    	return item>2;
    })
    console.log(ret) //false
    
    //箭头函数
    var ret = arr.every(item=>{return item>2})
    

    有 一个 some

    var arr = [1,2,3,9];
    var ret = arr.some(item=>{return item>2})
    console.log(ret) //true
    

    累加

    reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。reduce() 方法接受四个参数:初始值(或者上一次回调函数的返回值),当前元素值,当前索引,调用 reduce() 的数组。
    1、基本使用累加

    var arr = [1,2,3];
    var ret = arr.reduce(function(a,b){
    	return a+b;  
    })
    console.log(ret)
    //6
    

    2、二维数组转为一维数组

    var array = [[1, 2], [3, 4], [5, 6]].reduce(( acc, cur ) => {
        return acc.concat(cur)
    }, []);
    
    console.log(array)  // [ 0, 1, 3, 4, 5, 6 ]
    

    3、计算数组中每个元素出现的次数
    方法一

    let names = ['tom', 'jim', 'jack', 'tom', 'jack'];
    const countNames = names.reduce((allNames, name) => {
      if (name in allNames) {
        allNames[name] ++;
      }
      else {
        allNames[name] = 1;
      }
      return allNames;
    }, {});
    
    console.log(countNames)  // { tom: 2, jim: 1, jack: 2 }
    

    方法二

    const arraySum = (arr, val) => arr.reduce((acc, cur) => {
        return cur == val ? acc + 1 : acc + 0
    }, 0);
    
    let arr = [ 0, 1, 3, 0, 2, 0, 2, 3 ]
    console.log(arraySum(arr, 0)) // 数组arr中 0 元素出现的次数为3
    

    4、数组去重
    方法一

    let arr = [1, 2, 1, 2, 3, 5, 4, 5, 3, 4, 4, 4, 4];
    let result = arr.sort().reduce((init, current) => {
        if (init.length === 0 || init[init.length - 1] !== current) {
            init.push(current);
        }
        return init;
    }, []);
    console.log(result); //[1,2,3,4,5]
    

    方法二
    当然,对于数组去重,也可以直接使用es6的…[拓展运算符] + Set 实现:

    // console.log(...new Set([1,2,3,4,5,2,4,1]))
    
    const dedupe = (array) => {
        return Array.from(new Set(array));
    }
    console.log(dedupe([1, 1, 2, 3])) //[1,2,3]
    
  • 相关阅读:
    大三学长带我学习JAVA.作业8。。1 有1、2、3、4这几个数字,能组成多少个互不相同且无重复数字的三位数?都是多少?
    详解Manifest
    反射机制和配置文件的用法
    大三学长带我学习JAVA.作业8。 判断101200之间有多少个素数,并输出所有素数。
    序曲
    java打包生成jar和exe全过程
    大三学长带我学习JAVA.作业6 编写日历表 和vim
    大三学长带我学习JAVA.作业7 利用for循环打印 9*9 表
    动态代理类
    pku 3522 Slim Span
  • 原文地址:https://www.cnblogs.com/qingheshiguang/p/14789037.html
Copyright © 2020-2023  润新知