http://ejohn.org/blog/how-javascript-timers-work

这是John的一篇博文说到setTimeout和setInterval的区别,在看js高效图形编程的时候文中提到的。

首先很明显的是:

1. setTimeout是定时触发,在一定的延时后只触发一次,但是可以利用回调一个setTimeout来实现循环触发,比如:

setTimeout(function(){
/* Some long block of code... */
setTimeout(arguments.callee, 10);
}, 10);

而setInterval本身即表示循环触发,直到被取消为止(clearInterval(id);)。

2.JS是单线程的,每一个异步操作被触发时,如果当前正好有其他事件或者函数正在被执行,比如(用户突然点击了鼠标触发了某个onclick事件,我们是不能预测的),那个异步操作就会被压入queue队列中等到当前事件被执行之后再调用。

3.setTimeout被初始化之后被触发时一定会被压到队列中,等待被执行,而setInterval如果被触发时,发现先前有一个interval块再队列中没有被执行,那么他就会丢弃当前这个被触发的interval块,而不将其压入队列中。

这张图片诠释的非常好!可以看到红字的dropped是因为之前的一个interval还没有被执行,所以这个interval就不会被压到队列中。

所以setTimeout被调用的函数是可以预测一定会被执行的,setInterval则不一定,可能会在过程中被丢弃某一次的执行。但是具体是经过多少时间才被执行的,两者都是不能预测的,因为会被其他不可预测的事件阻塞

关于js中的setTimeout和setInterval的更多相关文章

  1. js中的setTimeout和setInterval

    在html页面中要使用自动刷新功能时,可以是使用js中setTimeout和setInterval: 一.使用方法 setTimeout的使用setTimeout('要调用的Js方法', 调用的延迟时 ...

  2. js中的setTimeout和setinterval 用法说明

    setTimeout("countSecond()", 1000)://countSecond()是函数(方法) setTimeout 只执行一次函数,需要传递两个参数1是函数名, ...

  3. js里的setTimeout和setInterval之后的页面是空白,阻塞浏览器的document对象,但是不阻塞script方法

    js里的setTimeout和setInterval是否进程阻塞? 阻塞浏览器的document对象,但是不阻塞script方法 当你在setTimeout中使用document.write时是不行的 ...

  4. QML中实现setTimeout和setInterval

    Qt的QML中,js未提供setTimeout和setInterval,可以通过下面的代码实现. Timer {id: timer} function setTimeout(cb,delayTime) ...

  5. asp.net类似于js中的setTimeOut()的函数作用?

    asp.net类似于js中的setTimeOut()的函数作用? 插入这行即可,定时2秒,再运行下一步: System.Threading.Thread.Sleep(); 加个随机数 Random r ...

  6. js中的SetTimeOut

    1. SetTimeOut()              1.1 SetTimeOut()语法例子              1.2 用SetTimeOut()执行Function           ...

  7. JavaScript中的setTimeout、setInterval和随机函数制作简易抽奖小程序

    几乎所有计算机语言有都内置随机函数.当然这种随机,人们习惯称为伪随机数发生器,产生的是一个[0,1)之间的一个小数.再通过简单算术运算生成一个符合需求的整数.JS中通用公式通常为parseInt(Ma ...

  8. JS中的setTimeout()函数

    1.setTimeout() 方法 setTimeout() 方法用于在指定的毫秒数后调用函数或执行表达式.返回一个 ID(数字),可以将这个ID传递给 clearTimeout() 来取消执行. s ...

  9. JS动画三剑客——setTimeout、setInterval、requestAnimationFrame

    一.前言 前端实现动画效果主要有以下几种方法:CSS3中的transition 和 animation ,Javascript 中可以通过定时器 setTimeout.setinterval,HTML ...

随机推荐

  1. [课程设计]Scrum 3.1 多鱼点餐系统开发进度(第三阶段项目构思与任务规划)

    Scrum 3.1 多鱼点餐系统开发进度(第三阶段项目构思与任务规划) 1.团队名称:重案组 2.团队目标:长期经营,积累客户充分准备,伺机而行 3.团队口号:矢志不渝,追求完美 4.团队选题:餐厅到 ...

  2. mysql5.6版本开启数据库查询日志方法

    在my.ini中的[mysqld]下添加了以下两行代码: general_log=ONgeneral_log_file = c:/mysql.log 这个log文件是可以用文本编辑工具如editplu ...

  3. 自己封装的json工具类

    package com.develop.util; import java.util.ArrayList; import java.util.HashMap; import java.util.Ite ...

  4. [poj3378] Crazy Thairs (DP + 树状数组维护 + 高精度)

    树状数组维护DP + 高精度 Description These days, Sempr is crazed on one problem named Crazy Thair. Given N (1 ...

  5. 不用安装Oracle_Client就能使用PLSQL_Developer

    1. 下载oracle的客户端程序包(30M)       只需要在Oracle官方网站下载一个叫Instant Client Package的软件就可以了,这个软件不需要安装,只要解压就可以用了,很 ...

  6. Gradle build设置自动log开关

    应用场景 通常情况下我们的apps发布后也就是release模式下log是不显示的,debug模式下是显示log的,但是在特殊情况下我们测试release包的时候需要log的时候,就无法使用Build ...

  7. 关于php语言的使用! ------php语言与JavaScript的使用 方法是相似

    <script type="text/javascript"> </script>--js与PHP同是一种弱类型语言 弱类型语言只是不显示表现  定义变量时 ...

  8. GC overhead limit exceeded填坑心得

    我遇到这样的问题,本地部署时抛出异常java.lang.OutOfMemoryError:GC overhead limit exceeded导致服务起不来,查看日志发现加载了太多资源到内存,本地的性 ...

  9. 页面加载后resize页面布局

    在我们写web的时候,有的时候页面加载完以后,布局位置有一些问题,手动改变窗口大小后则正常显示位置. 其实,我们手动改变窗口大小,是执行了resize方法. share一下兼容方法: coffee c ...

  10. iOS开发 Apple Pay

    一.什么是Apple Pay? 1. 概念 Apple Pay,简单来说, 就是一种移动支付方式.通过Touch ID/ Passcode,用户可使用存储在iPhone 6, 6p等设备上的信用卡和借 ...