Binding your setTimeout methods in JavaScript using Prototype
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!
no commit!
ajax
August 18, 2009