JavaScript 高阶函数实战指南：map、filter、reduce、sort 等数组方法解析

前言

若一个函数能够接收另一个函数作为参数，该函数即被定义为高阶函数。

以下是一个最基础的高阶函数示例：

function add(x, y, f) {
    return f(x) + f(y);
}
//当调用add(-5, 6, Math.abs)时，参数x，y和f分别接收-5，6和函数Math.abs，根据函数定义，可以推导计算过程为：
//x = -5;
//y = 6;
//f = Math.abs;
//f(x) + f(y) ==> Math.abs(-5) + Math.abs(6) ==> 11;
//return 11;

//用代码验证一下：
add(-5, 6, Math.abs); // 11

map 函数

map() 方法内置于 JavaScript 的 Array 对象中。通过调用 Array 的 map() 方法并传入自定义处理函数，可以生成并返回一个包含新元素的新数组。

例如，假设有一个数组，需要将其中每个元素转换为其平方值，并返回新数组。虽然使用传统循环也能实现，但这里演示如何使用 map 函数完成：

 function pow(x) {
            return x * x;
        }

        var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
        alert (arr.map(pow))

reduce 函数

数组的reduce()把一个函数作用在这个数组的[x1, x2, x3]上，这个函数必须接收两个参数，reduce()把结果继续和序列的下一个元素做累积计算。

具体示例如下：

let arr=[6,8,8,6,9,6]
        let a=arr.reduce(function(x,y){
            return x+y;
        })
        alert(a)

filter 函数

filter 函数主要用于数组过滤。它将接收的回调函数应用于每个元素，并根据回调返回的布尔值决定保留或丢弃该元素。

需要注意的是，filter() 接收的回调函数实际上支持多个参数，但在常规使用中，我们通常仅使用第一个参数来表示当前元素及其所属数组。

看一个简单的例子：有一个数组，现在想只保留数组的偶数元素，奇数元素全部过滤掉，看下代码：

var arr = [1,2,1,2,1,2,1,2];
        var r = arr.filter(function (x) {
            return x % 2 == 0;
        });
        alert(r)

sort

sort 方法主要用于数组排序。

示例：有一个数组，想将它按从小到大或从大到小的顺序排列，看下代码：

//从小到大排列
 let arr=[1,3,1,2,3,6,4,3]
        let arr1=arr.sort((a,b)=>a-b)
        alert(arr1)

//从大到小排列
 let arr=[1,3,1,2,3,6,4,3]
        let arr1=arr.sort((a,b)=>b-a)
        alert(arr1)

every 方法

数组对象提供的 every（）方法用于判断数组的所有元素是否均满足指定的测试条件。

例如：测试数组元素是否大于6

let arr=[4,6,8,8]
        let result=arr.every(function(a){
            return a>6
        })
        alert(result)

find 方法

数组对象提供的 find() 方法用于查找符合条件的第一个元素。如果找到，返回该元素；否则，返回 undefined。

let arr=[4,6,8,9]
        let result=arr.find(function(a){
            return a>6
        })
        alert(result)

findIndex 方法

数组对象提供的 findIndex() 方法用于查找符合条件的第一个元素的索引位置。如果找到，返回该元素的索引值。

 let arr=[4,6,8,9]
        let result=arr.findIndex(function(a){
            return a>6
        })
        alert(result)

forEach 方法

forEach() 方法用于对数组的每个元素执行一次给定的回调函数。

示例：遍历数组，先使用传统的 for 循环，再使用 forEach 函数，看下代码：

const items = ['item1', 'item2', 'item3'];
const copy = [];
//传统方式
for (let i=0; i<items.length; i++) {
  copy.push(items[i]);
}
// foreach方法
items.forEach(function(item){
  copy.push(item);
});

总结

到此这篇关于JavaScript中常见的高阶函数总结的文章就介绍到这了,更多相关JavaScript高阶函数内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站！

JavaScript 数组高阶函数详解：map、filter、reduce 等核心用法

前言