资讯专栏INFORMATION COLUMN

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

impig33 / 759人阅读

摘要:链式调用的模式下面是实现定时器清除以后回调定时器的一段伪代码看一段实例函数实现数字从增加到,每增加一次在控制台打印一次。结束以后可以立即执行回调函数。

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

某些间隔会被跳过;

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

书中给出了替代方案:链式调用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

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

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/78949.html

相关文章

  • 细说 Javascript 拾遗篇(四) : setTimeout 和 setInterval

    摘要:当间隔时间设置较小时,将会导致回调函数堆积。处理可能阻塞的代码最简单且最可控的方式就是在回调函数内部使用函数。但是很明显,由于指定最大值的限制,还会有定时器没有被清除掉。另外,尽量避免使用函数,从而避免可能导致的回调函数堆积现象。 由于 Javascript 是异步的,因此我们可以通过 setTimeout 和 setInterval 函数来指定特定时间执行代码。 function ...

    wangjuntytl 评论0 收藏0
  • 前端面试--浏览器

    摘要:打开一个网页,看到服务器返回给客户端浏览器的各种文件类型图片构建浏览器会遵守一套步骤将文件转换为树。因为浏览器有渲染线程与引擎线程,为了防止渲染出现不可预期的结果,这两个线程是互斥的关系。 1. 浏览器架构 用户界面 主进程 内核 渲染引擎 JS 引擎 执行栈 事件触发线程 消息队列 微任务 宏任务 网络异步线程 定时器线程 2. 从输入 url 到页面展示...

    bigdevil_s 评论0 收藏0
  • Nodejs高性能原理(下) --- 事件循环详解

    摘要:如果一个即时定时器是被一个正在执行的回调排入队列的,则该定时器直到下一次事件循环迭代才会被触发。参数描述在事件循环的当前回合结束时要调用的函数。事件轮询随后的调用,会在任何事件包括定时器之前运行。 系列文章 Nodejs高性能原理(上) --- 异步非阻塞事件驱动模型Nodejs高性能原理(下) --- 事件循环详解 前言 终于开始我nodejs的博客生涯了,先从基本的原理讲起.以前写...

    newsning 评论0 收藏0
  • 前端20个真正灵魂拷问,吃透这些你就是中级前端工程师 【上篇】

    摘要:还是老规矩,从易到难吧传统的定时器,异步编程等。分配对象时,先是在空间中进行分配。内存泄漏内存泄漏是指程序中己动态分配的堆内存由于某种原因程序未释放或无法释放,造成系统内存的浪费,导致程序运行速度减慢甚至系统崩溃等严重后果。 showImg(https://segmentfault.com/img/bVbwkad?w=1286&h=876); 网上参差不弃的面试题,本文由浅入深,让你在...

    mdluo 评论0 收藏0
  • 前端20个真正灵魂拷问,吃透这些你就是中级前端工程师 【上篇】

    摘要:还是老规矩,从易到难吧传统的定时器,异步编程等。分配对象时,先是在空间中进行分配。内存泄漏内存泄漏是指程序中己动态分配的堆内存由于某种原因程序未释放或无法释放,造成系统内存的浪费,导致程序运行速度减慢甚至系统崩溃等严重后果。 showImg(https://segmentfault.com/img/bVbwkad?w=1286&h=876); 网上参差不弃的面试题,本文由浅入深,让你在...

    leap_frog 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<