1. 程式人生 > >JS中的高階函式

JS中的高階函式

如果您正在學習JavaScript,那麼您必須遇到高階函式這個術語。這聽起來複雜,其實不然。
使JavaScript適合函數語言程式設計的原因是它接受高階函式。
高階函式在JavaScript中廣泛使用。如果你已經用JavaScript程式設計了一段時間,你可能已經使用它們甚至不知道。

要完全理解這個概念,首先必須瞭解函數語言程式設計是什麼一等函式(first-Class Function)以及的概念。

函數語言程式設計

在大多數簡單的術語中,函式程式設計是一種程式設計形式,您可以將函式作為引數傳遞給其他函式,並將它們作為值返回。在函數語言程式設計中,我們根據函式思考和編碼。

JavaScript,Haskell,Clojure,Scala和Erlang是實現函數語言程式設計的一些語言。

一等函式

如果您一直在學習JavaScript,您可能聽說過JavaScript將函式視為一等公民。那是因為在JavaScript或任何其他函數語言程式設計語言中,函式是物件。

在JavaScript中,函式是一種特殊型別的物件。他們是Function物件。

在JavaScript中,您可以使用其他型別(如物件,字串或數字)執行的所有操作函式都可以執行。您可以將它們作為引數傳遞給其他函式(回撥函式),將它們分配給變數並傳遞它們等等。這就是JavaScript中的函式被稱為First-Class函式(一等函式)的原因。

高階函式

高階函式是對其他函式進行操作的函式,可以將它們作為引數或通過返回它們。簡單來說,高階函式是一個函式,它接收函式作為引數或將函式作為輸出返回。

例如Array.prototype.mapArray.prototype.filter並且Array.prototype.reduce是一些高階功能,內建的語言。

執行高階函式

讓我們看一下內建高階函式的一些例子,看看它與我們不使用高階函式的解決方案的比較。

Array.prototype.map

map()方法通過呼叫作為輸入陣列中每個元素的引數提供的回撥函式來建立一個新陣列。該map()方法將從回撥函式中獲取每個返回值,並使用這些值建立一個新陣列。

傳遞給回撥函式map()方法接受3個引數:elementindex,和array

假設我們有一個數組,我們想要建立一個新陣列,其中包含第一個陣列的每個值的兩倍。讓我們看看如何使用和不使用高階函式來解決問題。

  • 不用高階函式
const arr1 = [1,2,3]; 
const arr2 = [];
for(let i = 0; i <arr1.length; i ++){ 
  arr2.push(arr1 [i] * 2); 
}
//列印[2,4,6] 
console.log(arr2);
  • 使用高階函式
const arr1 = [1,2,3];
const arr2 = arr1.map (function (item) { 
  return item * 2; 
}
console.log(arr2)
  • 我們可以使用箭頭函式語法使其更短
const arr1 = [1, 2, 3];
const arr2 = arr1.map(item => item * 2);
console.log(arr2);

建立我們自己的高階函式

到目前為止,我們看到了語言中內建的各種高階函式。現在讓我們建立自己的高階函式。

我們假設JavaScript沒有原生map方法。我們可以自己構建它,從而建立我們自己的高階函式。

假設我們有一個字串陣列,我們希望將此陣列轉換為整數陣列,其中每個元素表示原始陣列中字串的長度。

const strArray = ['JavaScript', 'Python', 'PHP', 'Java', 'C'];

function mapForEach(arr, fn) {
  const newArray = [];
  for(let i = 0; i < arr.length; i++) {
    newArray.push(
      fn(arr[i])
    );
  }
  return newArray;
}
const lenArray = mapForEach(strArray, function(item) {
  return item.length;
});
// prints [ 10, 6, 3, 4, 1 ]
console.log(lenArray);

在上面的例子中,我們建立了一個高階函式mapForEach,它接受一個數組和一個回撥函式fn。此函式迴圈遍歷提供的陣列,並在每次迭代時呼叫函式呼叫fn內的回撥函式newArray.push

回撥函式fn接收陣列的當前元素並返回該元素的長度,該元素儲存在newArrayfor迴圈完成後,newArray返回並分配給lenArray

結論

我們已經瞭解了高階函式和一個內建的高階函式。我們還學習瞭如何建立自己的高階函式。

簡而言之,高階函式是一個函式,它可以接收函式作為引數,甚至可以返回一個函式。高階函式就像常規函式一樣,具有接收和返回其他函式的附加能力,即引數和輸出。