快捷導(dǎo)航

javascript之典型高階函數(shù)應(yīng)用介紹

更新時(shí)間：2013年01月10日 08:55:20 作者：

這幾個(gè)方法均為javascript 1.6 數(shù)組新增的方法。是很典型的functional 函數(shù)，當(dāng)然也非常實(shí)用。下面是functional的定義并不來(lái)自javascript

緣由
雖然以前也使用過(guò)javascript語(yǔ)言，但終究是為了配合后端寫(xiě)的一些零零散散的“代碼段”，更不能說(shuō)是javascript項(xiàng)目了。很榮幸的是上個(gè)月剛到公司正好碰上項(xiàng)目開(kāi)始推倒重寫(xiě)，我們team從頭開(kāi)始做架構(gòu)和實(shí)現(xiàn)，目的很清楚，為了改進(jìn)和超越前面的版本。這是個(gè)真正意義上的javascript“項(xiàng)目”，當(dāng)然服務(wù)端不是我們team來(lái)負(fù)責(zé)啦。這也是我真正開(kāi)始全職使用javascript來(lái)編程。由于之前在學(xué)校對(duì)形式化方法這門(mén)課程比較感興趣，而javascript又是函數(shù)式語(yǔ)言，因此我想把更多functional的東西用javascript來(lái)表現(xiàn)一下。

幾個(gè)函數(shù)
這幾個(gè)方法均為javascript 1.6 數(shù)組新增的方法。是很典型的functional 函數(shù)，當(dāng)然也非常實(shí)用。下面是functional的定義并不來(lái)自javascript。

filter：接受一個(gè)集合Xs（X表示類(lèi)型,s表示集合），一個(gè)謂詞，這個(gè)謂詞是從X到bool的映射（函數(shù)）。然后過(guò)慮這個(gè)集合，并返回謂詞為true的元素組成的集合。下面是簡(jiǎn)單的實(shí)現(xiàn)：

復(fù)制代碼代碼如下:

 
function filter(arr,callback){ 
var i,out=[]; 
for(i=0;i<arr.length;i++){ 
if(callback(arr[i])) 
out.push(arr[i]); 
} 
return out; 
} 

再加一個(gè)簡(jiǎn)單的測(cè)試：

復(fù)制代碼代碼如下:

 
var arr = [1,2,3,4,5,6,7,8,9,10]; 
var even = function(item){ 
if(typeof item !== "number") return false; 
return !(item & 1); 
}; 
var filtered = filter(arr,even); 
console.log(filtered); 

結(jié)果：
2,4,6,8,10
map：接受一個(gè)集合Xs，一個(gè)函數(shù)f，然后把Xs集合中每一個(gè)元素按照順序使用f映射，并返回集合f x1, f x2, f x3 ... f xn。實(shí)現(xiàn)如下：

復(fù)制代碼代碼如下:

 
function map(arr,callback){ 
var i,l= arr && arr.length || 0,out = new Array(l); 
for(i=0;i<l;i++) 
out[i]=callback(arr[i]); 
return out; 
} 

測(cè)試一下：

復(fù)制代碼代碼如下:

 
var arr = [1,2,3,4,5,6,7,8,9,10]; 
var addTen = function(item){ 
return item + 10; 
}; 
var mapAdded = map(arr,addTen); 
console.log(mapAdded); 

結(jié)果：
11,12,13,14,15,16,17,18,19,20
另外還有forEach，every和some三個(gè)函數(shù)在javascript 1.6中出現(xiàn)。但在使用過(guò)程中感覺(jué)還是缺少一個(gè)有力的函數(shù)，它就是折疊函數(shù)(fold)。正所謂map-reduce，有了map而沒(méi)有"reduce"豈不是很掃興？下面就來(lái)看看這個(gè)”reduce“。

Reduce的實(shí)現(xiàn)
上面說(shuō)的reduce其實(shí)也就是折疊函數(shù)(fold)。它接受一個(gè)Xs集合，一個(gè)二元操作符f。然后將f插入到集合中的每?jī)蓚€(gè)相鄰元素之間。舉個(gè)例子，fold plus [1,2,3,4] 意即 1+2+3+4。為了更加精確，通常需要一個(gè)”起始元素“作為f最開(kāi)始時(shí)的第二個(gè)參數(shù)。例如 fold plus [1,2,3,4] 意即 (1+(2+(3+(4+0)))。下面是實(shí)現(xiàn)：

復(fù)制代碼代碼如下:

 
function fold(arr,callback,b){ 
var i,x; 
if(b) x=b,i=0; 
else x=arr[0],i=1; 
for(;i<arr.length;i++) 
x=callback(arr[i],x); 
return x; 
} 

測(cè)試：

復(fù)制代碼代碼如下:

 
var arr = [1,2,3,4,5,6,7,8,9,10]; 
var plus = function(a,b){ 
return a+b; 
}; 
var foldPlus = fold(arr,plus,0); 
console.log(foldPlus); 

結(jié)果：
55

這個(gè)函數(shù)在ECMAScript 5中名字就叫reduce，而函數(shù)式里面通常稱(chēng)做fold而已，這是很形象的名字。
總結(jié)
其實(shí)上面在實(shí)現(xiàn)這些functional函數(shù)的時(shí)候編寫(xiě)風(fēng)格并不是函數(shù)式的，因?yàn)閖avascript 語(yǔ)言有具有循環(huán)語(yǔ)句。如果沒(méi)有循環(huán)語(yǔ)句呢？留給下一次探索吧。

您可能感興趣的文章: