我想了解更多有关Javascript中的方法链接的信息,并想知道在没有jQuery的情况下为链中的下一个函数创建延迟的正确方法:
var foo = function() {
this.delay = function(per) {
setTimeout(start, per);
return this;
};
this.start = function() {
alert('start!');
};
};
var bar = new foo().delay(1000).start();
答案 0 :(得分:8)
这不容易做到。 jQuery使用specific queue system。
假设您想在没有jQuery的情况下执行此操作,则必须自己实现队列。
例如,这个非常简单的实现:
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;
};
};
如果你想链接另一个未在foo中定义的函数,你可以
var bar = new foo().delay(3000).start()
.addFunction(function(){alert("another chained one")});
答案 1 :(得分:3)
这将允许您链接多个延迟:http://jsfiddle.net/z4Uyf/1/
JS:
var foo = function() {
var delayed = [];
var delayExecution = false;
var delayCount = 0;
function handleDelay(func){
delayed.push(func);
delayCount++;
}
function delayDone(){
delayExecution = false;
if( typeof(delayed[0]) == "function" ){
delayed[0]();
delayed.splice(0,1);
}
if( delayed.length > 0 ) delayExecution = true;
}
this.delay = function(per) {
delayExecution = true;
setTimeout(function(){
delayDone();
}, per);
return this;
};
this.start = function() {
if( delayExecution ){
handleDelay(arguments.callee);
}else{
alert("start!");
}
return this;
};
};
var bar = new foo().delay(1000).start().delay(5000).start();