I am trying to learn more about Method chaining in Javascript and would like to know the proper way to create a delay with no jQuery to the next function in the chain:
var foo = function() {
this.delay = function(per) {
setTimeout(start, per);
return this;
};
this.start = function() {
alert('start!');
};
};
var bar = new foo().delay(1000).start();
This isn't easy to do. jQuery uses a specific queue system.
Suppose you want to do it without jQuery, you would have to implement a queue yourself.
For example this very simplistic implementation :
var foo = function() {
var queue = [];
var timer;
this.delay = function(per) {
timer = setTimeout(function(){
timer = 0;
var f;
while (f = queue.shift()) f();
}, per);
return this;
};
this.addFunction = function(f) {
if (timer) queue.push(f);
else f();
return this;
};
this.start = function() {
this.addFunction(function(){alert('start')});
return this;
};
};
Demonstration
If you want to chain another function not defined in foo, you may do
var bar = new foo().delay(3000).start()
.addFunction(function(){alert("another chained one")});
Demonstration
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With