map()、filter()和reduce()函數(shù)組成了函數(shù)式程序員工具集的核心部分,這個工具集包括一系列純的、 高階的函數(shù),它們是函數(shù)式方法的主力。實際上,它們是純函數(shù)和高階函數(shù)的典型,它們以一個函數(shù)為輸入, 返回一個輸出結果,并且不產生副作用。
然而它們是瀏覽器中ECMAScript 5.1的實現(xiàn)標準,它們只工作于數(shù)組。每次調用它們,一個新的數(shù)組會被創(chuàng)建并返回, 而原來存在的那個數(shù)組不會被改變。它們以函數(shù)為輸入,經常使用匿名函數(shù)作為回調函數(shù)。它們遍歷數(shù)組, 并對數(shù)組的每一個元素應用這個函數(shù)!
還有一點,它們只作用于數(shù)組,無法作用于其它可迭代的數(shù)據結構,比如對象。不用擔心, 有很多庫比如Underscore.js,Lazy.js,stream.js等等都實現(xiàn)了它們自己的更強大的map()、 filter()和reduce()。
回調
如果你以前從來沒用過回調,那這個概念可能會讓你有些迷惑。尤其是在Javascript中, Javascript給出了好幾種聲明函數(shù)的方式。
回調函數(shù)用于傳遞給另外一個函數(shù)供它們使用,這是一種像傳遞對象一樣來傳遞邏輯的方式:
對于比較簡單的任務可以用匿名函數(shù):
回調不僅用于函數(shù)式編程,在Javascript中它們能干很多事情。僅作為例子,這有個callback()函數(shù)用于jQuery的AJAX調用:
注意這里只用了函數(shù)的名字,因為我們并不是要調用函數(shù)而是傳遞函數(shù),寫成這樣就錯了:
如果我們調用了函數(shù)會發(fā)生什么?在這個例子里,myCallback(xhr)會嘗試執(zhí)行,控制臺將打印“undefined”, 并會返回true。當ajax()完成調用時,它根據名字找到的回調函數(shù)將是一個"true",然后就報錯了。
也就是說我們無法指定給回調函數(shù)傳什么參數(shù),如果我們的回調函數(shù)需要讓ajax()函數(shù)傳給他我們想要的參數(shù), 我們可以把回到函數(shù)包在一個匿名函數(shù)里:
Array.prototype.map()
map()是這些函數(shù)的老大,它簡單地對數(shù)組里的元素依此應用回調函數(shù)。
語法:arr.map(callback [, thisArg]);
參數(shù):
•callback(): 這個函數(shù)為新數(shù)組產生一個元素,它接收的參數(shù): ◦currentValue:數(shù)組當前遍歷到的元素
◦index:數(shù)組中當前元素序數(shù)
◦array:當前正在處理的數(shù)組
•thisArg:這是個可選參數(shù),當執(zhí)行回調的時候它作為回調函數(shù)的this
例子:
盡管Array.prototype.map方法是Javascript中數(shù)組對象的標準方法,你也可以很容易地擴展自己的對象。
Array.prototype.filter()
filter()函數(shù)用于把數(shù)組中的一些元素篩選出來。回調函數(shù)必須返回真(保留到新數(shù)組里)或假(扔掉)。 用map()可以做類似的事情,就是把你像扔掉的元素返回為null,不過filter()函數(shù)會在新數(shù)組里面刪除這些不要的元素, 而不是留個null占著位置。
語法:arr.filter(callback [, thisArg]);
•callback():這個函數(shù)用來測試數(shù)組中的每個元素,要保留返回真,否則返回假。它有這些參數(shù): ◦currentValue:數(shù)組當前遍歷到的元素
◦index:數(shù)組中當前元素的序數(shù)
◦array:當前正在處理的數(shù)組
•thisArg:這是個可選參數(shù),當執(zhí)行回調的時候它作為回調函數(shù)的this
例子:
Array.prototype.reduce()
reduce()函數(shù),有時也稱為fold,它用于把數(shù)組中的所有值聚集到一起。回調需要返回組合對象的邏輯。 對于數(shù)字來說,它們往往會被加到一起或者乘到一起。對于字符串來說,它們往往是被追加到一起。
語法:arr.reduce(callback [, initialValue]);
參數(shù)
•callback():此函數(shù)把兩個對象合并成一個對象,并將其返回。參數(shù)有: ◦previousValue:上一次回調函數(shù)被調用時返回的值,或者是初始值(如果有的話)
◦currentValue:數(shù)組當前正在處理的元素
◦index:數(shù)組中當前元素的序數(shù)
◦array:當前正在處理的數(shù)組
•initialValue:可選。第一次回調所傳入參數(shù)的初始值
例子
其它函數(shù)
map()、filter()和reduce()函數(shù)在我們輔助函數(shù)的工具箱里并不孤單。這里還有更多的函數(shù)幾乎在所有函數(shù)式應用里都會被使用。
Array.prototype.forEach
forEach()函數(shù)本質上是map()函數(shù)的非純版本,它會遍歷整個數(shù)組,并對每個元素應用回調。 然而這些回調函數(shù)不返回值。它是實現(xiàn)for循環(huán)的一個更純粹的方式。
語法:arr.forEach(callback [, thisArg]);
參數(shù):
•callback():對數(shù)組中每一個元素所應用的。參數(shù)有: ◦currentValue:數(shù)組中當前正在處理的元素
◦index:數(shù)組中當前元素的序數(shù)
◦array:正在處理的數(shù)組
•thisArg:可選?;卣{函數(shù)中作為this的值
例子:
Array.prototype.concat
如果不用for或while處理數(shù)組,你會經常需要把數(shù)組拼接起來。另一個Javascript內建函數(shù)concat就是專門干這事兒的。 concat函數(shù)會返回一個新數(shù)組但不改變舊數(shù)組。它可以把你傳入的所有參數(shù)拼接到一起。
console.log([1, 2, 3].concat(['a','b','c']) // 拼接兩個數(shù)組
// Output: [1, 2, 3, 'a','b','c']
它返回兩個數(shù)組拼接成的數(shù)組,同時原來的那些數(shù)組沒有被改變。這就意味著concat函數(shù)可以鏈式調用。
變量x、y、z的值最后都是[1,2,3,4,5,6,7,8,9]。
Array.prototype.reverse
這個Javascript內建函數(shù)是用于數(shù)組變形的。reverse函數(shù)用于將一個數(shù)組反轉,也就是第個一元素會跑到最后, 而最后一個元素變成了第一個元素。
然而,這個函數(shù)并不會返回一個新的數(shù)組,而是把原來的數(shù)組替換掉了。我們可以做個更好的。下面是一個純的反轉數(shù)組函數(shù)
Array.prototype.sort
與map()、filter()和reduce()函數(shù)相似,排序函數(shù)sort()需要傳入一個回調函數(shù)來定義數(shù)組如何排序。 但是,跟reverse()一樣,它也會把原來的數(shù)組替換。這可不太好。
arr = [200, 12, 56, 7, 344];
console.log(arr.sort(function(a,b){return a–b}) );
// arr現(xiàn)在是: [7, 12, 56, 200, 344];
我們可以寫一個純函數(shù)的sort(),但是排序算法的源代碼很麻煩。對于特別大的數(shù)組,應當根據特定的數(shù)據結構來選用適合的算法, 比如快速排序、合并排序、冒泡排序等等。
Array.prototype.every 和 Array.prototype.some
Array.prototype.every() 和 Array.prototype.some() 都是純的高階函數(shù),它們是Array對象的方法, 通過回調函數(shù)根據數(shù)組各元素返回的布爾值(或相當于布爾的值)來進行測試。如果數(shù)組中所有的元素通過回調函數(shù)計算都返回True, every()函數(shù)就返回true;如果數(shù)組中有一個元素返回True,some()函數(shù)就返回True。
例子:
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯(lián)系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com