9

I'm stumped on how to correctly pass parameters to a callback function without immediately calling that function.

For example, this will work as expected:

var callBack = function() { ... }
window.setTimeout( callBack, 1000 );

But this will accidentally call callBack:

var callBack = function(param1, param2) { ... }
window.setTimeout( callBack('foo','bar'), 1000 );
emersonthis
  • 32,822
  • 59
  • 210
  • 375

2 Answers2

10

You can call it as follows,

var callBack = function(param1, param2) { ... }
window.setTimeout( function(){callBack('foo','bar');}, 1000 );
melc
  • 11,523
  • 3
  • 36
  • 41
  • No need for an anonymous function here - it just clutters up the code. The settimeout function supports passing arguments to it's callback - so why not use it? – Lix Dec 08 '13 at 18:14
  • 2
    @Lix both ways are acceptable, however passing the arguments to the callback i think is not supported in ie. – melc Dec 08 '13 at 18:17
  • @Lix Nevertheless I'm happy this answer was posted because it shows a more generic solution that works when the function taking the callback doesn't also take arguments for the cb. Now only `bind()` is missing (to be mentioned, not more) :) – Mörre Dec 08 '13 at 18:18
  • @Lix i'm was sure i had seen it somewhere, e.g. `http://stackoverflow.com/questions/8641047/passing-callback-parameters-to-settimeout-does-not-work-in-ie` – melc Dec 08 '13 at 18:20
  • @Mörre since you mentioned `bind` :) , `http://stackoverflow.com/questions/12451844/settimeout-with-arguments` – melc Dec 08 '13 at 18:22
  • @melc You managed to thwart URL auto-detection - don't make URLs code-styled and they will be links! Example: http://www.reddit.com/r/cats/ :) – Mörre Dec 08 '13 at 18:25
  • @Mörre haha hadn't noticed, thanks for mentioning – melc Dec 08 '13 at 18:28
  • @melc - Ah... IE strikes again :P – Lix Dec 08 '13 at 18:33
8

The way to pass parameters is after the time parameter as is stated in the documentation of settimeout().

var timer = window.setTimeout( func, delay, [ param1, param2, ... ]

The first argument is the actual callback, the second is the time in miliseconds and the last (optional) argument is an array of parameters to pass to the callback.

So, for your example it would be something like:

window.setTimeout( callBack, 1000, [ "foo", "bar" ] );

The title of your question is slightly misleading as the method used to pass parameters to a callback function differs in the implementation of the code that is using it. As you might imagine, the actual function object and it's parameters don't necessarily need to be passed together as the functions execution is deferred to a later time; Only then do the parameters need to come in contact with the callback.

For a more generic explanation of how to pass arguments to a callback object you can take a look at this post: JavaScript: Passing parameters to a callback function.

Community
  • 1
  • 1
Lix
  • 47,311
  • 12
  • 103
  • 131
  • Your example is not quite correct. The square brackets in the documentation are only there to indicate that the extra parameters are optional. You should leave them out of your example otherwise it will pass a single parameter which is an array containing the two parameters. – Michael Lawton Feb 02 '20 at 11:02