setTimeout - how to avoid using string for callback?

Question

When using setTimeout, you have to put the code you want to execute into a string:

setTimeout('alert("foobar!");', 1000);

However, I want to execute a function to which I have a reference in a variable. I want to be able to do this:

var myGreatFunction = function() { alert("foobar!"); };
// ...
setTimeout('myGreatFunction();', 1000);

(Though in real life, the alert is a lengthier bit of code and myGreatFunction gets passed around as a parameter to other functions, within which the setTimeout is called.)

Of course, when the timeout triggers, myGreatFunction isn't a recognised function so it doesn't execute.

I wish javascript let me do this, but it doesn't:

setTimeout(function() { myGreatFunction(); }, 1000);

Is there a nice way round this?

Answer 1

If you don't need to call myGreatFunction with any arguments, you should be able to pass setTimeout a function reference:

setTimeout(myGreatFunction, 1000);

Also, you should always avoid passing setTimeout code that it needs to evaluate (which is what happens when you wrap the code in quotes). Instead, wrap the code in an anonymous function:

setTimeout(function() {
    // Code here...
}, 1000);

See the setTimeout page at the Mozilla Development Centre for more information.

Steve

Answer 2

Who said that it doesn't let you do it?

It does, the code -

setTimeout(function() { myFunction(); }, 1000);

is perfectly valid.