這篇文章主要介紹了javascript函數式編程,實例分析了javascript函數式編程的相關使用技巧,非常具有實用價值,需要的朋友可以參考下
本文實例講述了javascript函數式編程。分享給大家供大家參考。具體分析如下:
js像其他動態語言一樣是可以寫高階函數的,所謂高階函數是可以操作函數的函數。因為在js中函數是一個徹徹底底的對象,屬於第一類公民,這提供了函數式編程的先決條件。
下面給出一個例子代碼,出自一本js教程,功能是計算數組元素的平均值和標准差,先列出非函數式編程的一種寫法:
?
1 2 3 4 5 6 7 8 9 10 11 12 var data = [1,1,3,5,5]; var total = 0; for(var i = 0;i < data.length;i++) total += data[i]; var mean = tatal/data.length; //平均數為3 //計算標准差 total = 0; for(var i = 0;i < data.length;i++){ var deviation = data[i] - mean; tatal += deviation * deviation; } var stddev = Math,.sqrt(total/(data.length-1));//標准差為2為了使用函數式編程,我們預先定義一些幫助函數(helper functions):
?
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 //將類數組對象轉換為真正的數組 function array(a,n){ return Array.prototype.slice.call(a,n||0); } //將函數實參傳遞至左側 function partial_left(f){ var args = arguments; return function(){ var a = array(args,1); a = a.concat(array(arguments)); return f.apply(this,a); }; } //將函數的實參傳遞至右側 function partial_right(f){ var args = arguments; return function(){ var a = array(arguments); a = a.concat(array(args,1)); return f.apply(this,a); }; } //該函數實參被用做模版, //實參列表中的undefined值會被實際實參值填充。 function partial(f){ var args = arguments; return function(){ var a = array(args,1); var i = 0,j = 0; for(;i<a.length;i++) if(a[i] === undefined) a[i] = arguments[j++]; a = a.concat(array(arguments,j)); return f.apply(this,a); }; } //返回一個函數類似於f(g()) function compose(f,g){ return function(){ return f.call(this,g.apply(this,arguments)); }; }下面我們給出完全用函數式編程的js代碼:
?
1 2 3 4 5 6 7 8 9 10 var data = [1,1,3,5,5]; var sum = function(x,y){return x+y;}; var product = function(x,y){return x*y;}; var neg = partial(product,-1); var square = partial(Math.pow,undefined,2); var sqrt = partial(Math.pow,undefined,0.5); var reciprocal = partial(Math.pow,undefined,-1); //好吧,高潮來鳥 :) var mean = product(reduce(data,sum),reciprocal(data.length)); var stddev = sqrt(product(reduce(map(data,compose(square,partial(sum,neg(mean)))),sum),reciprocal(sum(data.length,-1))));除了reduce和map函數,其他函數前面都給出了。reduce函數類似與ruby中的inject函數:
?
1 2 ary = (1..10).to_a ary.inject(0) {|sum,i|sum + i} //結果為55js的寫法如下:
?
1 2 3 4 var ary = [1,2,3,4,5,6,7,8,9,10] ary.reduce(function(sum,i){ return sum + i; },0);0為sum的初始值,如果省略則sum為數組第一個元素的值,這裡可以省略。
map函數也很簡單,類似與對數組的每一個元素做操作,然後返回一個經過操作後的數組,就以ruby代碼為例,js代碼與此類似:
?
1 2 a = (1..3).to_a; #數組[1,2,3] a.map {|x| x*2} #返回新數組[2,4,6]下面我們來分析下那一長串的代碼:)
sum和product定義了元素相加和相乘的函數;
neg也是一個函數功能等價於:product(-1,x),即對x值求負;
square函數等價於:Math.pow(x,2),即計算x的平方值,注意這裡partial的第二個參數是undefined,這意味著這裡的形參會被第一個實參填補;再說的明白點:square(x)功能等於Math.pow(x,2)。
sqrt函數和square類似,功能等價於:Math.pow(x,0.5),相當於計算x的開二次方。
最後一個函數reciprocal也沒什麼難度,等價於:Math.pow(x,-1),即計算x的負一次方,相當於計算x的倒數。
下面就是如何把上面各種函數揉捏在一起鳥 :)
先看平均值的計算,很簡單:就是先計算數組元素的和然後乘上數組長度的倒數,即數組和/數組長度。
最後來看貌似很難的標准差,我們最好由內向外看:
先看包含neg的那層:
?
1 2 //等價於函數sum(-1 * mean + x) partial(sum,neg(mean)下面看compose函數:
?
1 2 3 4 //下面在源代碼上做了等價替換,可以再次等價於: //square(sum(-1*mean + x)),再次展開(我剝,我剝,我剝洋蔥...): //Math.pow(sum(-1*mean + x),2); compose(square,sum(-1*mean + x))接下來看map函數:
//很清楚吧!?即data中每一個元素都為一個x,將其傳入後面的函數,然後返回一個計算後的新數組,即新數組中的每個元素的值是data中的每個元素加上data負的平均數,然後對其結果計算2次方的結果。
?
1 map(data,Math.pow(sum(-1*mean + x),2))再接著看map外面的reduce函數:
?
1 2 //將前面新數組的每個元素值加起來。 reduce(map(...),sum)然後看一下reciprocal函數:
?