Take the 2-minute tour ×
Code Review Stack Exchange is a question and answer site for peer programmer code reviews. It's 100% free, no registration required.

I've written a quick little helper for event & call debounce/throttling. Since I'm at home and none of my regular code review friends are on-line I figured I'd turn to the great folks here! Would love any feedback you might have.

/**
 * debounce
 * @param {integer} milliseconds This param indicates the number of milliseconds
 *     to wait after the last call before calling the original function .
 * @return {function} This returns a function that when called will wait the
 *     indicated number of milliseconds after the last call before
 *     calling the original function.
 */
Function.prototype.debounce = function (milliseconds) {
    var baseFunction = this,
        timer = null,
        wait = milliseconds;

    return function () {
        var self = this,
            args = arguments;

        function complete() {
            baseFunction.apply(self, args);
            timer = null;
        }

        if (timer) {
            clearTimeout(timer);
        }

        timer = setTimeout(complete, wait);
    };
};

/**
* throttle
* @param {integer} milliseconds This param indicates the number of milliseconds
*     to wait between calls before calling the original function.
* @return {function} This returns a function that when called will wait the
*     indicated number of milliseconds between calls before
*     calling the original function.
*/
Function.prototype.throttle = function (milliseconds) {
    var baseFunction = this,
        lastEventTimestamp = null,
        limit = milliseconds;

    return function () {
        var self = this,
            args = arguments,
            now = Date.now();

        if (!lastEventTimestamp || now - lastEventTimestamp >= limit) {
            lastEventTimestamp = now;
            baseFunction.apply(self, args);
        }
    };
};

To help understand what the point of these helpers are I've prepared this demo: http://jsfiddle.net/zR5jV/1/

GitHub project can be found here: https://github.com/m-gagne/limit.js

share|improve this question
    
Honestly, you'd probably be better off just using underscore.js, rather than reinventing the wheel (unless you're doing it for fun). At just around 4K minified, it's a very powerful library that includes more refined versions of both of these methods and is complimentary to almost every other JavaScript library. –  blesh Apr 26 '12 at 19:46
    
Cool hadn't heard of underscore.js before, thanks. Yes this was more of a "do it for fun" / "try creating a project & associated website" project. It was also more to bring to light the issue of frequency of events that people might not know of. Rarely as a developer do we ever get to create something truly unique, but I've learned a lot and gotten some great feedback in producing this simple snippet of code :) –  Marc Gagne Apr 27 '12 at 15:20
add comment

1 Answer 1

up vote 2 down vote accepted

The key differences between a throttled function and a debounced function are that the throttled function can return a value because it is called synchronously and the debounced version cannot because it is used asynchronously.

You have lost that on your throttle implementation. I would at least make the following change:

Function.prototype.throttle = function (milliseconds) {
    var baseFunction = this,
        lastEventTimestamp = null,
        limit = milliseconds,
        lastresult;

    return function () {
        var self = this,
            args = arguments,
            now = Date.now();

        if (!lastEventTimestamp || now - lastEventTimestamp >= limit) {
            lastEventTimestamp = now;
            lastresult = baseFunction.apply(self, args);
        }
        return lastresult;
    };
};
share|improve this answer
    
Good point, I've only used throttle in scenarios where I don't care about the return value. I'll integrate this into my library, thanks! –  Marc Gagne Apr 25 '12 at 12:22
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.