setInterval() only running function once

Question

I want to periodically query a PHP script for new messages. To do so, I'm using the setInterval() function and AJAX.

$(document).ready(function(){

    var queryInterval = 1000; /* How fast we query for new messages */

    setInterval(getMessages(), queryInterval);

    function getMessages() {
        console.log("tick");
    }

});

However, when I look at the Javascript console, I'm only seeing "tick" once. I've made sure that the console doesn't ignore any more logs of the same strings, so if the code was working properly it should show "tick" in the console every second.

Anyone know what could be going wrong here?

Answer 1

Remove the () after getMessage

Answer 2

This calls getMessages, not schedules it. Remove the parenthesis.

setInterval(getMessages(), queryInterval);

setInterval(getMessages, queryInterval);

Answer 3

Actually, setInterval isn't running getMessages at all (not even once). setInterval expects a reference to a function, but you're executing the getMessages function immediately and passing its return value to setInterval (which is undefined). That's what the parens after getMessage do.

Pass a reference to setInterval like this:

setInterval(getMessages, queryInterval);

If this is the only place that getMessages is used, then you could also write it like this:

setInterval(function() {
    console.log("tick");
}, queryInterval);

Answer 4

Although others have already covered this ground above, both window.setTimeout() and window.setInterval() require function references. Your code provides, instead, the return value from a function invocation.

When you wish to call, or invoke, a JavaScript function, you write, as expected:

DoMyfunction();

The JavaScript engine will execute that function upon encountering that line.

However, what setTimeout() and setInterval() require, is a reference to the function object corresponding to your function. Which you obtain via the following, and similar means:

myFunc = DoMyFunction;

That line copies a reference to the function object corresponding to DoMyFunction() into a new variable. Which you can then pass to setInterval() and setTimeout(), viz:

discard = window.setTimeout(myFunc, 1000);

That line above will direct the JavaScript engine to execute your intended function (namely DoMyFunction()) once, after 1 second has elapsed, and:

discard = window.setInterval(myFunc, 1000);

will direct the JavaScript engine to execute your intended function repeatedly, once every second.

You could, of course, achieve the same effect, without using a new variable, simply as follows:

discard = window.setTimeout(DoMyFunction, 1000);

etc.

If, however, you make the mistake of using:

discard = window.setTimeout(DoMyFunction(), 1000);

what happens instead is that DoMyFunction() is executed, and any return parameter arising therefrom is then passed to the window.setTimeout() function. Since window.setTimeout() is expecting a function object reference to be passed here, and instead receives whatever your function returns (or undefined if your function returns nothing), then the internal checking performed by setTimeout() (and setInterval()) will reveal that it hasn't received a function object reference here, and simply abort silently.

A far more insidious bug, of course, could arise if DoMyFunction() actually does return a valid function object! If you've written DoMyFunction() to do this, then that function object will be passed to setTimeout() instead, and that function will be run! Of course, you could use this intentionally, and write your DoMyFunction() as a closure, returning the actual function you want setTimeout() to execute as a function object return parameter, and if you use that approach, then the form:

discard = window.setTimeout(DoMyFunction(), 1000);

will no longer be erroneous.

Remember, every JavaScript function you write in your code, when that code is parsed, is associated with a function object by the JavaScript engine. To execute the function, use:

DoMyFunction();

To reference the function object instead, use:

DoMyFunction;

Those () can make a huge amount of difference according to context, as a result of JavaScript taking this approach to differentiating between a function object reference and a function execution instruction.

Answer 5

Change:

setInterval(getMessages(), queryInterval);

To:

setInterval(getMessages, queryInterval);

Answer 6

Check your code line:

setInterval(getMessages(), queryInterval);

The setInterval function requires you to pass the reference to your callback function.

When you pass getMessages(), You are actually calling the function and passing its returning object to the setInterval function.

So just change your line to:

setInterval(getMessages, queryInterval);

and it will works fine!