让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);
}

实例代码

原文地址:https://www.cnblogs.com/gateluck/p/2917059.html