【JavaScript】定时器清除以后回调定时器

在《JavaScript高级程序设计》一书中，列举了两条setInterval()的缺点：

1. 某些间隔会被跳过；

2. 多个定时器的代码执行之间的间隔可能会比预期的小。

书中给出了替代方案：链式调用setTimeout()。所以我现在更倾向于使用setTimeout()。

链式调用setTimeout()的模式：

setTimeout(function(){
    //todo
    setTimeout(arguments.callee, delay);
}, delay);

下面是实现定时器清除以后回调定时器的一段伪代码：

function callbackTimer(..., fn) {
    return function() {
        setTimeout(function() {
            if (...) {
                //todo
                setTimeout(arguments.callee, delay);
            } else if (fn instanceof Function) {
                fn();
                fn = null;
            }
        }, delay)
    };
}

看一段实例：count函数实现数字从min增加到max，每增加一次在控制台打印一次。结束以后可以立即执行回调函数。

function count(min, max, delay, fn) {
    return function() {
        setTimeout(function() {
            if (min <= max) {
                console.log(min++);
                setTimeout(arguments.callee, delay);
            } else if (fn instanceof Function) {
                fn();
                fn = null;
            }
        }, delay);
    };
}
var count2 = count(11, 20, 500);
var count1 = count(1, 10, 200, count2);
count1();

在控制台内先以0.2s一次的频率打印1~10，之后再以0.5s一次的频率打印11~20。

---

转载请注明出处：https://segmentfault.com/a/1190000004639491

文章不定期更新完善，如果能对你有一点点启发，我将不胜荣幸。