資料結構
網路
關係型資料庫管理系統
作業系統
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+ 閱讀量
