DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> javascript的currying函數介紹
javascript的currying函數介紹
編輯:關於JavaScript     
最早期的curry函數有點多態的意味,就是根據函數參數在內部選用分支:
復制代碼 代碼如下:
//http://www.openlaszlo.org/pipermail/laszlo-user/2005-March/000350.html
// ★★On 8 Mar 2005, at 00:06, Steve Albin wrote:
function add(a, b) {
if (arguments.length < 1) {
return add;
} else if (arguments.length < 2) {
return function(c) { return a + c }
} else {
return a + b;
}
}

var myadd = add( 2 );
var total = myadd(3);

日本的一個先行者可能在未搞清arguments也能用Array的原生方法轉換為數組的時候,用非常復雜的正則與eval搞出一個更接近現代currying意味的函數。
復制代碼 代碼如下:
function curry(fun) {
if (typeof fun != 'function') {
throw new Error("The argument must be a function.");
}
if (fun.arity == 0) {
throw new Error("The function must have more than one argument.");
}

var funText = fun.toString();
var args = /function .*\((.*)\)(.*)/.exec(funText)[1].split(', ');
var firstArg = args.shift();
var restArgs = args.join(', ');
var body = funText.replace(/function .*\(.*\) /, "");

var curriedText =
"function (" + firstArg + ") {" +
"return function (" + restArgs + ")" + body +
"}";

eval("var curried =" + curriedText);
return curried;
}


[Ctrl+A 全選 注:如需引入外部Js需刷新才能執行]
接著是閉包的流行,與數組轉換arguments的技術的發現,現代currying函數終於粉墨登場,就好像15~17世紀大航海時代的地理大發現,javascript的世界突然間開闊了許多。
復制代碼 代碼如下:
//一個簡單的現代currying函數
function curry (fn, scope) {
var scope = scope || window;
var args = [];
for (var i=2, len = arguments.length; i < len; ++i) {
args.push(arguments[i]);
};
return function() {
fn.apply(scope, args);
};
}

一般的currying函數只有兩重,執行情況如下,第一次執行參數不足返回內部函數,第二次執行才最終完成。不過針對這參數,我們還是可以做一些文章。看如下函數:
復制代碼 代碼如下:
function sum(){
var result=0;
for(var i=0, n=arguments.length; i<n; i++){
result += arguments[i];
}
return result;
}
alert(sum(1,2,3,4,5)); // 15

這就沒有所謂的參數不足問題,傳入一個參數,它也計算。但不傳入參數呢?無錯,區別在於有沒有參數。我們可以讓它不斷執行自身,如果參數存在的情況下。最後在沒有參數的情況下,一次過執行。換言之,前面的步驟是用於儲存參數。
復制代碼 代碼如下:
var sum2= curry(sum);
sum2= sum2(1)(2)(3)(4)(5);

sum2(); // 15

比起一般的currying函數,這有點難度。具體看注解:
復制代碼 代碼如下:
var curry= function(fn){//原函數的參數為函數
return function(args){//內部函數的參數為數組,由於立即執行,因此直接到第三重去
//args是相對於第三重內部函數可是全局變量
var self= arguments.callee;//把自身保存起來(就是那個數組為參數的第二重函數)
return function(){ //這才是第二次調用的函數
if(arguments.length){//如果還有要添加的參數
[].push.apply(args,arguments);//apply把當前傳入的所有參數放進args中
return self(args);
}else{
return fn.apply(this,args);//apply的第二參數為數組
}
}
}([]);
};

復制代碼 代碼如下:
function sum(){
var result=0;
for(var i=0, n=arguments.length; i<n; i++){
result += arguments[i];
}
return result;
};
var curry = function(fn){//原函數的參數為函數
return function(args){//內部函數的參數為數組,由於立即執行,因此直接到第三重去
var self= arguments.callee;//把自身保存起來
return function(){ //這才是第二次調用的函數
if(arguments.length){//如果還有要添加的參數
[].push.apply(args,arguments);
return self(args);
}
else return fn.apply(this,args);//執行
}
}([]);
};
var sum2= curry(sum);
sum2= sum2(1)(2)(3)(4)(5);
alert(sum2());

或者每次傳入多個參數:
復制代碼 代碼如下:
function sum(){
var result=0;
for(var i=0, n=arguments.length; i<n; i++){
result += arguments[i];
}
return result;
};
var curry = function(fn){//原函數的參數為函數
return function(args){//內部函數的參數為數組,由於立即執行,因此直接到第三重去
var self= arguments.callee;//把自身保存起來
return function(){ //這才是第二次調用的函數
if(arguments.length){//如果還有要添加的參數
[].push.apply(args,arguments);
return self(args);
}
else return fn.apply(this,args);//執行
}
}([]);
};
var sum2= curry(sum);
sum2= sum2(1,2,3);
sum2= sum2(4,5,6);
sum2= sum2(7,8,9);
alert(sum2());

但上面的函數有不足之處,最後怎麼也要放個括號,我們想只要參數足夠就返回結果,多出的參數忽略。改進如下:
復制代碼 代碼如下:
function curry(f) {
if (f.length == 0) return f;
function iterate(args) {
if (args.length <= f.length)
return f.apply(null, args);
return function () {
return iterate(args.concat(Array.prototype.slice.call(arguments)));
};
}
return iterate([]);
}


[Ctrl+A 全選 注:如需引入外部Js需刷新才能執行]
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved