在setInterval函数中传递参数


320

请告知如何将参数传递给使用的函数setInterval

我的例子setInterval(funca(10,3), 500);是不正确的。


2
语法:.setInterval(func, delay[, param1, param2, ...]);
O-

Answers:


543

您需要创建一个匿名函数,以便不会立即执行实际函数。

setInterval( function() { funca(10,3); }, 500 );

4
动态参数应该是什么?
rony36

28
@ rony36-您可能想要一个为您创建间隔计时器的函数。将参数传递给函数,以便其值在函数闭包中捕获并在计时器到期时保留。function createInterval(f,dynamicParameter,interval) { setInterval(function() { f(dynamicParameter); }, interval); }然后将其称为createInterval(funca,dynamicValue,500); 显然,您可以将其扩展为多个参数。并且,请使用更具描述性的变量名。:)
tvanfosson

@tvanfosson:很棒的答案!你知道如何清除间隔形式的功能funca
2016年

@tvanfosson谢谢。不好意思,但实际上是您在注释部分给出的createInterval示例。它将如何工作?我当时也在考虑将计时器变量作为动态参数传递,但是不确定如何或是否有意义。为了清楚起见,我在这里添加了一个新问题:stackoverflow.com/questions/40414792/…–
Flo

78

现在使用ES5,绑定方法Function prototype:

setInterval(funca.bind(null,10,3),500);

参考这里


2
这是最好的答案,但是根据功能的不同,可能会有意外的行为。例如console.log.bind(null)("Log me")将抛出Illegal invocation,但console.log.bind(console)("Log me")将按预期工作。这是因为console.log需要console作为thisarg。
2014年

1
迄今为止最好的答案。保持身体清洁。非常感谢!
Tobi 2014年

非常干净高效!
contactmatt 2014年

2
只需添加适用于Chrome> = 7,Firefox> = 4.0,Explorer> = 9,Opera> = 11.60,Safari> = 5.1(来源:developer.mozilla.org/ca/docs/Web/JavaScript/Reference/…)的工具即可。
Roger Veciana

60

将它们添加为setInterval的参数:

setInterval(funca, 500, 10, 3);

您问题中的语法使用eval,不建议您这样做。


2
哇?!从什么时候开始允许的?(严重问题)
新月新鲜

1
不确定。我的来源是:developer.mozilla.org/en/DOM/window.setInterval
Kev

2
@Kev Internet Explorer真是一团糟它不支持传递参数-.-
ShrekOverflow 2012年

1
恕我直言,这应该是公认的答案。尼斯,简单和干净的解决方案。
LightMan '18

32

您可以将参数作为函数对象的属性而不是参数传递:

var f = this.someFunction;  //use 'this' if called from class
f.parameter1 = obj;
f.parameter2 = this;
f.parameter3 = whatever;
setInterval(f, 1000);

然后,在您的函数中someFunction,您将可以访问参数。这在类中特别有用,在这些类中,作用域会自动进入全局空间,并且您丢失对调用setInterval的类的引用。通过这种方法,在上面的示例中,“ someFunction”中的“ parameter2”将具有正确的作用域。


1
您可以通过Classname.prototype.someFunction.parameter1
JoaquinG 2012年

2
向对象或函数中添加参数可能会导致编译器速度变慢,因为它必须重建对象的本机代码表示形式(例如,如果这是在热循环中完成的),因此请务必小心。
mattdlockyer

22
     setInterval(function(a,b,c){

          console.log(a + b +c);  

      }, 500, 1,2,3);

           //note the console will  print 6
          //here we are passing 1,2,3 for a,b,c arguments
         // tested in node v 8.11 and chrome 69

最好的解释答案。
Drk_alien '16

那么为什么将参数作为数组传递呢?这个细节甚至与问题无关。
464 user4642212


18
setInterval(function,milliseconds,param1,param2,...)

更新:2018-使用“ spread”运算符

function repeater(param1, param2, param3){
   alert(param1);
   alert(param2);
   alert(param3); 
}

let input = [1,2,3];
setInterval(repeater,3000,...input);


这样更好。
Ugur Kazdal

这样更好。
Ugur Kazdal

11

到目前为止,最实用的答案是tvanfosson给出的答案,我所能做的就是为您提供ES6的更新版本:

setInterval( ()=>{ funca(10,3); }, 500);

1
您是说()=> {}是ES6替换function(){}的新方法吗?有趣。首先,我以为火箭已经过去了。而且,除非该语法有其他常见用途,否则它是非常非常奇怪的。我看到它们是“胖箭头”。不过,很奇怪。我猜有人喜欢它,这只是见仁见智。
Richard_G '16

6

引用参数就足够了:

OK --> reloadIntervalID = window.setInterval( "reloadSeries('"+param2Pass+"')" , 5000)

KO --> reloadIntervalID = window.setInterval( "reloadSeries( "+param2Pass+" )" , 5000)

注意'每个参数的单引号。

经过IE8,Chrome和FireFox的测试


7
使用eval是一种可怕的做法。使用匿名函数会更好。
SuperIRis

1

我知道这个主题太老了,但这是我在setInterval函数中传递参数的解决方案。

HTML:

var fiveMinutes = 60 * 2;
var display = document.querySelector('#timer');
startTimer(fiveMinutes, display);

JavaScript:

function startTimer(duration, display) {
    var timer = duration,
        minutes, seconds;

    setInterval(function () {
        minutes = parseInt(timer / 60, 10);
        seconds = parseInt(timer % 60, 10);

        minutes = minutes < 10 ? "0" + minutes : minutes;
        seconds = seconds < 10 ? "0" + seconds : seconds;

        display.textContent = minutes + ":" + seconds;
        --timer; // put boolean value for minus values.

    }, 1000);
}

我需要在调用函数时访问一次值,但不是每秒访问一次,因此您的答案提供了此值(例如timer),但是clearInterval()在这种情况下您如何处理?
user1063287

0

这有效setInterval("foo(bar)",int,lang);.. Jon Kleiser引导我找到答案。


0

另一个解决方案是传递这样的函数(如果您具有动力学变量):setInterval('funca('+ x +','+ y +')',500);



0

这个问题将是使用闭包的一个很好的示范。这个想法是一个函数使用一个外部作用域的变量。这是一个例子

setInterval(makeClosure("Snowden"), 1000)

function makeClosure(name) {
var ret

ret = function(){
    console.log("Hello, " + name);
}

return ret;
}

函数“ makeClosure”返回另一个函数,该函数可以访问外部范围变量“名称”。因此,基本上,您需要将任何变量传递给“ makeClosure”函数,并在分配给“ ret”变量的函数中使用它们。因此,setInterval将执行分配给“ ret”的功能。


0

我在Vue应用程序中遇到了同样的问题。就我而言,这种解决方案仅在匿名函数已声明为箭头函数(关于mounted ()生命周期挂钩处的声明)的情况下才有效。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.