Pass parameters in setInterval function

JavascriptParametersSetinterval

Javascript Problem Overview


Please advise how to pass parameters into a function called using setInterval.

My example setInterval(funca(10,3), 500); is incorrect.

Javascript Solutions


Solution 1 - Javascript

You need to create an anonymous function so the actual function isn't executed right away.

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

Solution 2 - Javascript

Add them as parameters to setInterval:

setInterval(funca, 500, 10, 3);

The syntax in your question uses eval, which is not recommended practice.

Solution 3 - Javascript

now with ES5, bind method Function prototype :

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

Reference here

Solution 4 - Javascript

     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

Solution 5 - Javascript

You can pass the parameter(s) as a property of the function object, not as a parameter:

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

Then in your function someFunction, you will have access to the parameters. This is particularly useful inside classes where the scope goes to the global space automatically and you lose references to the class that called setInterval to begin with. With this approach, "parameter2" in "someFunction", in the example above, will have the right scope.

Solution 6 - Javascript

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

Update: 2018 - use the "spread" operator

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

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

Solution 7 - Javascript

You can use an anonymous function;

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

Solution 8 - Javascript

By far the most practical answer is the one given by tvanfosson, all i can do is give you an updated version with ES6:

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

Solution 9 - Javascript

Quoting the arguments should be enough:

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

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

Note the single quote ' for each argument.

Tested with IE8, Chrome and FireFox

Solution 10 - Javascript

const designated = "1 jan 2021"

function countdown(designated_time){

    const currentTime = new Date();
    const future_time = new Date(designated_time);
    console.log(future_time - currentTime);
}

countdown(designated);

setInterval(countdown, 1000, designated);

There are so many ways you can do this, me personally things this is clean and sweet.

Solution 11 - Javascript

The best solution to this answer is the next block of code:

setInterval(() => yourFunction(param1, param2), 1000);

Solution 12 - Javascript

I know this topic is so old but here is my solution about passing parameters in setInterval function.

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

Solution 13 - Javascript

This works setInterval("foo(bar)",int,lang);.... Jon Kleiser lead me to the answer.

Solution 14 - Javascript

Another solution consists in pass your function like that (if you've got dynamics vars) : setInterval('funca('+x+','+y+')',500);

Solution 15 - Javascript

You can use a library called underscore js. It gives a nice wrapper on the bind method and is a much cleaner syntax as well. Letting you execute the function in the specified scope.

http://underscorejs.org/#bind

_.bind(function, scope, *arguments)

Solution 16 - Javascript

That problem would be a nice demonstration for use of closures. The idea is that a function uses a variable of outer scope. Here is an example...

setInterval(makeClosure("Snowden"), 1000)

function makeClosure(name) {
var ret

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

return ret;
}

Function "makeClosure" returns another function, which has access to outer scope variable "name". So, basically, you need pass in whatever variables to "makeClosure" function and use them in function assigned to "ret" variable. Affectingly, setInterval will execute function assigned to "ret".

Solution 17 - Javascript

I have had the same problem with Vue app. In my case this solution is only works if anonymous function has declared as arrow function, regarding declaration at mounted () life circle hook.

Solution 18 - Javascript

Also, with IE Support > 9, you can pass more variables insider set interval that will be taken by you function. E.g:

function myFunc(arg1, arg2){};
setInterval(myFunc, 500, arg1, arg2);

Greetings!

Solution 19 - Javascript

This worked for me

let theNumber = document.getElementById('number');
let counter = 0;

function skills (counterInput, timer, element) {
  setInterval(() => {
    if(counterInput > counter) {
      counter += 1;
      element.textContent = `${counter} %` 
    }else {
      clearInterval();
    }
  }, timer)
}

skills(70, 200, theNumber);

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionRakeshView Question on Stackoverflow
Solution 1 - JavascripttvanfossonView Answer on Stackoverflow
Solution 2 - JavascriptKevView Answer on Stackoverflow
Solution 3 - JavascriptsbrView Answer on Stackoverflow
Solution 4 - JavascriptmanasView Answer on Stackoverflow
Solution 5 - JavascriptJuanView Answer on Stackoverflow
Solution 6 - JavascriptswoggerView Answer on Stackoverflow
Solution 7 - JavascriptSimonView Answer on Stackoverflow
Solution 8 - JavascriptA.rodriguezView Answer on Stackoverflow
Solution 9 - JavascriptwaterazuView Answer on Stackoverflow
Solution 10 - JavascriptAllayeView Answer on Stackoverflow
Solution 11 - JavascriptPeter PalmerView Answer on Stackoverflow
Solution 12 - JavascriptKaan KaracaView Answer on Stackoverflow
Solution 13 - JavascriptStephenView Answer on Stackoverflow
Solution 14 - JavascriptnonozorView Answer on Stackoverflow
Solution 15 - JavascriptSagar ParikhView Answer on Stackoverflow
Solution 16 - JavascriptAleksey KanaevView Answer on Stackoverflow
Solution 17 - JavascriptSrdjan MilicView Answer on Stackoverflow
Solution 18 - JavascriptSamuel DiezView Answer on Stackoverflow
Solution 19 - JavascriptThierno Amadou Mouctar BaldeView Answer on Stackoverflow