乐趣区

关于javascript:JavaScript-数组方法filter和reduce

前言

在 ES6 新增的数组办法中,蕴含了多个遍历办法,其中蕴含了用于筛选的 filter 和 reduce

filter

次要用于筛选数组的 filter 办法,在应用中,不会扭转原数组,同时会将合乎筛选条件的元素,放入新的数组进行返回。

/***
   * @item 数组元素
   * @index 遍历数组下标
   * @thisArr 以后数组
   */
let arr1 = [1, 2, 3, 4, 5];
  let newArr1 = arr1.filter((item, index, thisArr) => {console.log(item);
    console.log(index);
    console.log(thisArr);
    return item > 2;
  })
  console.log(arr1);
  console.log(newArr1);`

下面的代码,运行之后,能够看到原来的数组 arr1 没有产生扭转,而 newArr1 用于接管合乎筛选条件的数组

// [1, 2, 3, 4, 5]  arr1
// [3, 4, 5]    newArr1

reduce

不同于 map 和 filter 这类遍历办法,reduce 的语法较为非凡一点

语法:

array.reduce(function(total,currentValue,currentIndex,thisArr){},initValue);
@function 回调函数作为第一个参数,total 作为返回值或者初始值进行返回

currentValue 以后遍历的元素

currentIndex 以后遍历元素下标

thisArr 为以后执行操作的数组。initValue 是作为传递给函数的初始值 

数组求和

// 数组求和
let arr1 = [1, 2, 3, 4, 5]
let totals = arr1.reduce(function (prev, next) {console.log(prev);
    console.log(next);
    return prev + next;
}, 0)
console.log(totals)

筛选首字母是否是含有 b 字母

let arr = ['beep', 'boop', 'foo', 'bar'];
console.log(arr.reduce((acc, val) => (val[0] === 'b' && acc.push(val), acc), []));

// 进阶每个数是否含有 'b'
arr.reduce((acc, val) => 
           (val.indexOf('b') >-1 && acc.push(val), acc),
           [])

除了数组求和之外,reduce 还能够解决数组去重,遍历最大值最小值的操作

同时还能已高阶函数的模式供其余函数进行调用。

最初

reduce 和 filter 作为 ES6 中数组新增的办法,在面试和开发中常常会遇到,能够通过这两个函数联合其余相似 map 等新办法去解决一些较为简单的数据。

文章集体博客地址:JavaScript 数组办法 filter 和 reduce

退出移动版