发布于 2026-01-06 1 阅读
0

高阶函数

高阶函数

JavaScript 是一种函数式编程语言,因为它支持高阶函数。
在深入学习高阶函数之前,我们可以先了解如何通过使用高阶函数
而非普通函数来简化代码。

假设我们要将数组中的所有负数转换为正数,反之亦然。使用普通函数的代码如下所示

const numbers = [1, 2, 3, 4, 5];

function changeSign(array) {
  for (let index = 0; index < array.length; index++) {
    console.log(array[index] * -1);
  }
}

changeSign(numbers);
Enter fullscreen mode Exit fullscreen mode

如果我们使用像 forEach() 这样的高阶函数来解决同一个问题,它会在一行内完成。

numbers.forEach((value)=>console.log(value*-1));
Enter fullscreen mode Exit fullscreen mode

高阶函数是指接受函数作为参数或返回函数的函数。

我们可以在 JavaScript 中看到一些高阶函数:

  1. 地图()
  2. 筛选()
  3. 减少()
  4. forEach()
  5. 每一个()

地图()

  • map() 方法会将给定的函数映射到数组中的每个值,并返回一个新数组。
  • 当我们想要遍历数组中的每个值,并在特定条件发生时进行更改时,可以使用 map() 方法。
  • 假设我们要计算数组中每个元素的平方,我们可以不用考虑数组的索引,甚至不用使用 for 循环就能做到这一点。
  let numbers=[1,2,3,4,5];
  const squares=numbers.map(value=>value*value);
Enter fullscreen mode Exit fullscreen mode

筛选()

  • filter() 方法会根据函数内部提供的条件,从中创建一个新数组。
  • 它从数组中筛选出所需的项,并据此创建一个新数组。
  • 当您想要从数组中删除不必要的元素时,filter() 方法非常有用。
  • 假设我们要从数组中返回偶数元素。
  let numbers=[2,3,17,18,4,6];
  const even=numbers.filter(value=>value%2==0); //returns 2,18,4,6
Enter fullscreen mode Exit fullscreen mode

减少()

  • reduce() 方法将数组简化为单个实体。
  • 它的函数最多接受四个参数——

previousValue, currentValue, currentIndex, array

  • reduce() 方法可以通过计算数组中所有值的总和来轻松理解。
  let numbers = [1, 2, 3];
  let initialValue=0;
  let sum = numbers.reduce(function (previousValue, currentValue) {
      return previousValue + currentValue;
  },initialValue);
Enter fullscreen mode Exit fullscreen mode
  • reduce 方法的初始值为 0,因此 previousValue 最初为 0(initialValue),currentValue 为数组的第一个元素。然后,currentValue 加到 previousValue 上,结果存储在previousValue中。这个过程会一直重复,直到遍历完所有元素,最后返回 previousValue 并将其存储在 sum 中。

forEach()

  • forEach() 方法会对每个元素至少执行一次给定的函数。
  • 通常,forEach() 用于打印数组中的元素。但它的用途远不止于此。由于它可以应用于数组中的每个元素,我们甚至可以用它来修改数组中的单个元素。
  let students = ['John', 'Sara', 'Jack'];

  // using forEach
  students.forEach((item, index, arr)=>{
        // adding strings to the array elements
        arr[index] = 'Hello ' + item;

  });
   //returns ["Hello John", "Hello Sara", "Hello Jack"]
Enter fullscreen mode Exit fullscreen mode

每一个()

  • every() 方法会测试数组中的所有元素是否都满足所提供函数中的条件。
  • 如果条件满足数组中的所有元素,则该方法返回 true,否则返回 false。
  • 假设我们要检查所有元素是否大于 10 或给定的数字。
  function isBigEnough(element, index, array) {
    return element >= 10;
  }
  let numbers=[12, 5, 8, 130, 44];
  numbers.every(isBig);
Enter fullscreen mode Exit fullscreen mode
  • 这些并非 JavaScript 中仅有的高阶函数。学习如何使用这些函数不仅能帮助你编写更优质的代码,还能让你更好地掌握这门语言的基础知识。
文章来源:https://dev.to/mohammed_muddassir/higher-order-functions-1cac