编程技术文章分享与教程

网站首页 > 技术文章 正文

JavaScript高阶函数

hmc789 2024-11-18 12:59:09 技术文章 2 ℃

我的读者们,新年快乐,希望新的一年里大家继续支持,我会为大家奉上更多更好的文章与视频。

关注留言点赞,带你了解最流行的软件开发知识与最新科技行业趋势。

高阶函数是编程中一个重要且强大的概念,它允许您编写更灵活和模块化的代码。在 JavaScript 中,它们是使用其他回调函数的函数,可以将它们作为参数或将它们作为输出返回。

在 JavaScript 中我们有一些高阶数组函数,它们包括:

  • Map 函数:这是一个高阶函数,它接受一个数组和一个函数作为参数,并返回一个新的修改后的数组,该数组是将函数应用于前一个数组的每个元素的结果。

let array1 = [3, 5, 17, 30];

//create function

function multiply(p1) {

return p1 * 2;

}

//pass function as an argument

const map1 = array1.map(multiply);

console.log(map1);

// expected output:

Array [6,10,34,60]

  • Filter 函数:这是一个高阶函数,它接受一个数组和一个函数作为参数,但在这种情况下只返回一个新的元素数组,这些元素在函数中传递了给定的条件。

let array1 = [3, 5, 17, 30];

//filters out only numbers greater than 6

const result = array1.filter(x => x > 6);

console.log(result);

// expected output:

Array [17,30]

  • Reduce 函数:这是一个高阶函数,它接受一个数组和一个函数作为参数,但它只返回一个值,该值是按特定顺序将函数应用于数组的每个元素的结果。这可能会造成混淆,所以让我们使用直接来自 MDN 的常见且简单的示例

    MDN 网络文档

    MDN Web Docs 站点提供有关开放式 Web 技术的信息,包括用于网站和渐进式 Web 应用程序的 HTML、CSS 和 API。

    developer.mozilla.org

    解释

const array1 = [1, 2, 3, 4];

const initialValue = 0;// 0 + 1 + 2 + 3 + 4

const sumWithInitial = array1.reduce( (accumulator, currentValue) => accumulator + currentValue, initialValue);

console.log(sumWithInitial);

//Expected output: 10

reducer 逐个元素遍历数组,在每一步将当前数组值添加到上一步的结果(此结果是所有先前步骤的运行总和)——直到没有更多元素要添加。在这里阅读更多..

  • Sort 函数:这是一个高阶函数,它接受一个数组和一个函数作为参数,并返回对同一数组的引用,现在根据将函数应用于每个元素的结果进行排序。但是,这可以默认使用(它将所有元素视为字符串并按升序对它们进行排序)而无需函数参数,例如..

const names = ['Michael','Amy', 'John', 'Faith', 'Dan'];

//the sort function in defaultnames.sort();

console.log(names);

// expected output:

Array ["Amy", "Dan", "Faith", "John", "Michael"]

但是,当我们需要对字符串以外的其他内容进行排序时,例如数字,那么我们将需要添加一个函数来处理它。这是对数字进行排序的示例

const array1 = [1, 30, 4, 21, 10000];

//function that sorts by going through and return the lowest of two numbers

function numSort (a,b) { return (a - b);}

//calling the sort function with the numSort callback function

array1.sort(numSort);

console.log(array1);

//Expected result : [1,4,21,30,100000]

  • For Each 函数:这是一个高阶函数,它将一个数组和一个函数作为参数,并将该函数应用于数组的每个元素。它不返回一个新数组,而只是对同一个数组的每个元素执行一个操作。

const foods = ['pizza', 'spaghetti', 'food from Chowopa.com', 'burgers'];

//applies this function on each element in the foods array

foods.forEach((food) => {

let statement = `I am hungry, maybe I'll get ${food}`;

console.log(statement);

});

高阶函数为您提供了一种更简单的方法来编写更简洁和更具表现力的代码,并且还可以摆脱编写复杂循环或条件语句的需要。

我希望你觉得这很有用。再见。

Tags:

标签列表
最新留言