讓window.setTimeout等支持帶參數方法

在寫js時經常會使用到無參或固定參數方法，比如window.setTimeout(func,300) 比如$("input").click(func)等

如果我們需要定時執行的一個參多個參數方法，應該如果處理呢？

比如有這樣一個方法：

function log(a, b){
　　console.log(a + "_" + b);
}

我們需要定時400毫秒后執行

直接用log方法是行不通的：

window.setTimeout(log,100); //錯誤的

我們首先想到可行的方法：

window.setTimeout(function(){log(1,2)},100);

 

再來一個復雜點的例子，先看一個槽糕的寫法：

for ( var i = 0; i < 20; i++) {
    window.setTimeout( function () {
        log(i,i+1);
    }, 100);
}    

這樣每次出來的結果都是20_21

正確的寫法

for ( var i = 0; i < 20; i++) {
    window.setTimeout( function (a,b) {
        return function () { log(a,b); };
    }(i,i+1), 100);
}    

 

如果覺得這樣寫比較復雜，可以用更通用的方式
可以為Function擴展一個方法，專門用來返回一個無參方法

Function.prototype.curry = function () {
    var slice = Array.prototype.slice,
        args = slice.apply(arguments),
        that = this ;
    return function () {
        return that.apply(null , args.concat(slice.apply(arguments)));
    };
};

 

上面的方法就可以簡化為：

for ( var i = 0; i < 20; i++) {
    window.setTimeout(log.curry(i,i+1), 100);
}

 

實例代碼