Binding your setTimeout methods in JavaScript using Prototype

Posted on April 20, 2009. Filed under: DHTML, JavaScript | Tags: , , , , |

Never mind, use this instead :-)

www.prototypejs.org/api/function/delay

Two features which are indispensable in Prototype are it’s bind and bindAsEventListener functions. I’m not going to write about what they can do for you, but do know that they are indispensable to OO JavaScript for callbacks, lambda functions, closures etc… One place where I desperately wanted to use bind()ing, as well as have the ability to call methods within an instantiated Class, was with setTimeout() callbacks. Here’s the solution I came up with:


var _Class = Class.create({
    initialize: function() {
        this._someVar = 0;
    },
    function1: function() {
        this._someVar++;
        this.function3();
    },
    function2: function() {
        var _lambda = this.function1.bind(this);
        setTimeout(_lambda,10);
    },
    function3: function() {
        alert(this._someVar);
    }
});

var object = new _Class;
object.function3(); // 0
object.function2(); // 1

Basically, what you do is assign the method you want to call [without the parenthesis ()] to a variable [in this case, _lambda], and finally bind() it…


var _lambda = this.function1.bind(this);

Then, simply assign _lambda to setTimeout().

If you don’t bind() this to the method, it will assume that the this you’re referring to is window, and not your _Class instance.

As always, please comment with any constructive contributions below. I know this isn’t probably the best way to implement this, so if you know a better way, please comment!

Advertisements

Make a Comment

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

One Response to “Binding your setTimeout methods in JavaScript using Prototype”

RSS Feed for Adventures in PHP / DHTML / CSS and MySQL Comments RSS Feed


Where's The Comment Form?

Liked it here?
Why not try sites on the blogroll...

%d bloggers like this: