高阶函数：英文叫Higher-order function。JavaScript的函数其实都指向某个变量。既然变量可以指向函数，函数的参数能接收变量，那么一个函数就可以接收另一个函数作为参数，这种函数就称之为高阶函数。

常用的高阶函数：

filter

filter()方法的作用是：接收一个函数，依次作用数组每个元素，并过滤符合函数条件的元素，将剩下的数组作为一个新数组返回。

通常使用方式：arr.filter(callback(), thisArg)，更多详细介绍可以参考 MDN Array.filter()

参数：

• callback(ele, index, array) : 过滤条件的方法，当返回true则保存该元素，反之不保留，三个参数：
  • 1. ele 当前处理的元素
  • 1. index 当前处理的元素的索引，可选
  • 1. array 调用filter()方法的数组，可选
• thisArg 执行 callback 时的用于 this 的值，可选

返回值：
返回一个过滤剩下的元素组成的新数组。

过滤数值
let arr = [1, 2, 3, 4, 5, 6];
let res = arr.filter(x => x % 2 != 0);
// res => [1, 3, 5]
过滤不满足条件的值
let arr = [1, 2, 3, 4, 5, 6];
let res = arr.filter(x => x > 3);
// res => [4, 5, 6]
过滤null,underfined,空格
let arr = ['a', '', null, undefined, 'b', ''];
let tri = arr.filter(x => x && x.trim());
// tri => ["a", "b"]

map

map()方法的作用是：接收一个函数作为参数，对数组中每个元素按顺序调用一次传入的函数并返回结果，进行一些修改，不改变原数组，返回一个新数组。
通常使用方式：arr.map(callback())
参数：

• arr : 需要操作的数组；
• callback(currentValue, index, array, thisArg) : 处理的方法，四个参数；
  • 1. currentValue 当前处理的元素的值
  • 1. index 当前处理的元素的索引，可选
  • 1. array 调用map()方法的数组，可选
  • 1. currentVthisArgalue 执行 callback 函数时使用的 this 值，可选

返回值：
返回一个处理后的新数组。

let arr = [1, 3, -5];
let a1 = arr.map(Math.abs);
// a1 => [1, 3, 5];
let a2 = arr.map(String);
// a2 => ["1", "3", "-5"]

reduce

reduce()方法的作用是：接收一个函数，对数组进行累加操作，把累计结果和下一个值进行操作，最后返回最终的单个结果值。

通常使用方式：arr.reduce(callback(), initValue)，更多详细介绍可以参考 MDN Array.reduce()

参数：

• callback(returnValue, currentValue, currentIndex, array) : 累记器的方法，四个参数：
  • 1. returnValue 上一次处理的返回值，或者初始值
  • 1. currentValue 当前处理的元素的值，可选
  • 1. currentIndex 当前处理的元素的索引，可选
  • 1. array 调用reduce()方法的数组，可选
• initValue 初次调用callback()时候returnValue参数的初始值，默认数组第一个元素，可选

返回值：
返回一个最终的累计值。

let arr = [1, 3, -5];
let sum1 = arr.reduce((res, cur) => res + cur);
// sum1 => -1
let sum2 = arr.reduce((res, cur) => res + cur , 1);
// sum1 => 0

除此之外，javascript还为数组提供了很多利用回调函数实现具体功能的方法

最后

以上就是还单身帅哥最近收集整理的关于js常用的高阶函数filtermapreduce的全部内容，更多相关js常用内容请搜索靠谱客的其他文章。