How does this "delay" function works

Question

I am using this code to wrap parts of code in it is used like this,

var delay = (function() {
    // SET TIMER
    var timer = 0;
    // RETURN SET TIMEOUT FUNCTION
    return function(callback, ms) {
        clearTimeout(timer);
        timer = setTimeout(callback, ms);
    };
})();

I call it like this,

delay(function() {
     .......
}, 1000);

And it will delay it by 1000 milliseconds, but I do not understand what is going on thanks :)

I suggest you ask that on http://codereview.stackexchange.com/ — , Apr 08 '12 at 22:36
Have a look at [`clearTimeout`](https://developer.mozilla.org/en/DOM/window.clearTimeout) and [`setTimeout`](https://developer.mozilla.org/en/DOM/window.setTimeout). — Felix Kling, Apr 08 '12 at 22:37
You may also want to look at anonymous function definition. Here is a [link](http://stackoverflow.com/questions/1140089/how-does-an-anonymous-function-in-javascript-work) . — DiamRem, Apr 08 '12 at 22:44

score 7 · Accepted Answer · answered Apr 08 '12 at 22:44

The delay is a function that will return another function. The timer variables is inside the closure of the delay function so it can still be accesed by the returning function. The function. You could also write it like this

var delay;
var timer = 0;
delay = function(callback, ms) {
    clearTimeOut(timer);
    timer = setTimeout(callback, ms);
}

The problem that you have now is that if you call delay twice it will overwrite the timer variables so the second delay will overwrite the timer variable. I tested this out and it seems that your function is also broken it should be:

var delay = function(){
// SET TIMER
    var timer = 0;
// RETURN SET TIMEOUT FUNCTION
    return function(callback, ms){
        clearTimeout(timer);
        timer = setTimeout(callback, ms);
    };
};

delay()(function(){console.log("hello1");}, 5000);
delay()(function(){console.log("hello2");}, 5000);

If your code does the same it will only trace hello2 because the first one will overwrite the timer variable.

Unless your intention is that a second delay will stop the first delay you should use a different approuch.

score 2 · Answer 2 · answered Apr 08 '12 at 22:39

The first thing this code does is to execute this function (thanks to the () at the very end of the code you posted):

function() {
    // SET TIMER
    var timer = 0;
    // RETURN SET TIMEOUT FUNCTION
    return function(callback, ms) {
        clearTimeout(timer);
        timer = setTimeout(callback, ms);
    };
}

and store the result in delay. When executed, this function creates a closure with the local variable timer that severs as a local counter. The function then returns the inner function:

function(callback, ms) {
   clearTimeout(timer);
   timer = setTimeout(callback, ms);
}

Since it is in closure, this inner function has access to the timer variable. No other outside code can access timer. This method is used to allow multiple timers to be running at once without having to worry about multiple timer variables.

Imagine it like this: delay now contains a function (function(callback, ms) {...) which has access to a local variable, timer. The variable timer is invisible as far as any outside code is concerned. Only the function that delay contains can access it.

You then invoke that inner function by calling delay(callback, timeout).

score 0 · Answer 3 · answered Apr 08 '12 at 22:39

in the first piece of code u make a variable that is delay and assign if to the return value of a function.. which is in turn returning a function which is

return function(callback, ms) {
        clearTimeout(timer);
        timer = setTimeout(callback, ms);
    }

so this is actly ur delay varible. nw so when u call it like ..

delay(function() {
     .......
}, 1000);

this wud work as expected..
also notice the () at the end where u assing the delay variable.. that in javascript means to run a function as soon as it is encountered.. so when the first part of the code i seen it is run and delay variable is assigned a function.. which u call in the second piece of code

How does this "delay" function works

3 Answers3

Linked