数据结构
网络
关系型数据库管理系统
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
服装设计
法律研究JavaScript 中高阶函数的用途是什么？
在本文中，我们将讨论 JavaScript 中高阶函数的用途。
高阶函数简单来说，就是一个函数，它可以接受其他函数作为参数和/或返回一个函数。要了解高阶函数，我们应该学习回调函数。回调函数是指作为参数传递给另一个函数的函数。借助回调函数，一个函数可以调用另一个函数，并且回调函数只有在另一个函数执行完毕后才会运行。一些高阶函数包括 map、reduce 和 filter。
为了更好地理解，让我们进一步在本篇文章中查看示例。
示例
以下是演示回调函数实现的示例程序。
<!DOCTYPE HTML>
<html>
<head>
<title>Why to Use Higher Order Functions</title>
</head>
<body style = "text-align:center;">
<h3>To show how call back functions work.</h3>
<p id="text1"></p>
<script type="text/javascript">
function display(val) {
document.getElementById("text1").innerHTML = "The multiplication of two values is "+val;
}
function Multiply(a,b,result) {
let mul = a*b;
return result(mul);
}
Multiply(25,25,display);
</script>
</body>
</html>
执行上述代码后，将生成以下输出。
使用 Map 函数
Map 函数允许你传递一个适用于数组中每个元素的函数。
示例
以下是 map 函数实现的示例。
<!DOCTYPE HTML>
<html>
<head>
<title>Why to Use Map Function</title>
</head>
<body style = "text-align:center;">
<h3>To show how call Map function work.</h3>
<p id="text1"></p>
<script type="text/javascript">
function display(val) {
document.getElementById("text1").innerHTML = "The Squares of the numbers in the list are: "+val;
}
let arr1 = [11,22,33,44,55];
function Square(a) {
return a*a;
}
var result = arr1.map(Square);
display(result);
</script>
</body>
</html>
执行上述代码后，将生成以下输出。
使用 Reduce 函数
Reduce 函数执行一个reducer回调函数。通常，当你想通过执行加法、乘法等函数将整个数组缩减为单个元素时，我们会使用 reduce 函数。对于这些特定函数，我们可以使用 reduce 函数，而不是使用循环概念。Reduce 方法有两种类型 - reduce() 和reduceRight()。它包含两个参数 - previousValue 和currentValue
reduce() 方法默认从数组的第一个元素开始，并向前移动到数组的最后一个元素。
reduceRight() 方法默认从数组的最后一个元素开始，并向后移动到数组的第一个元素。
示例
以下是实现 reduce 方法的示例程序。
<!DOCTYPE HTML>
<html>
<head>
<title>Why to Use Higher Order Functions</title>
</head>
<body style = "text-align:center;">
<h3>To display how Reduce function work.</h3>
<p id="text1"></p>
<script type="text/javascript">
let arr1 = [[1,2],[2,3],[3,4],[4,5]];
function productOfArray(prev,curr) {
return prev.concat(curr);
}
var result1 = [[1,2],[2,3],[3,4],[4,5]].reduce(productOfArray);
var result2 = arr1.reduceRight(productOfArray);
document.getElementById("text1").innerHTML = "The Concatenation of list by reduce method: "+result1+" The Concatenation of list by reduceRight method: "+result2;
</script>
</body>
</html>
执行上述代码后，将生成以下输出。
使用 Filter 函数
Filter 方法对数组中的每个元素执行回调函数，该函数是一个布尔函数，必须返回 true 或 false。它返回回调函数为 true 的元素，并过滤掉回调函数为 false 的元素。
示例
以下是实现 filter 方法的示例程序。
<!DOCTYPE HTML>
<html>
<head>
<title>Why to Use Higher Order Functions</title>
</head>
<body style = "text-align:center;">
<h3>To display how Filter function work.</h3>
<p id="text1"></p>
<script type="text/javascript">
let arr1 = [1,3,7,9,6,13,17,20,18];
function isPrime(num) {
for (let i = 2; num > i; i++) {
if (num % i == 0) {
return false;
}
}
return num > 1;
}
var result1 = arr1.filter(isPrime);
document.getElementById("text1").innerHTML = "The Prime numbers from the list are: "+result1;
</script>
</body>
</html>
执行上述代码后，将生成以下输出。
1K+ 阅读量
