setInterval 和 settimeout的区别

setinterval
1.会造成某些间隔会被跳过
2.多个定时器之间的执行代码事假间隔比预期的小

而且 当定时器代码添加到任务队列里面没有被执行的
时候 不能在添加新的定时器代码

在定时器代码执行的时候 随便添加

看图说明问题

当在5ms创建了一个间隔为200ms的定时器

btn.onclick=funcion(){

setInterval(function(){

//代码执行时间为300ms多一点

},200);

//整个click时间代码执行时间为300ms

};

当点击按钮的时候 到5ms 的时候 就会执行seInterval
然后到了205ms 就把定时器代码添加到任务队列
当click事件处理程序执行完毕之后
立刻就会执行205ms处的定时器代码
然后在定时器代码执行过程中
会在405ms处添加一个新的定时器代码
然后在605ms处添加新的定时器代码
这里不会添加成功
因为405ms处的定时器代码没有开始执行
所以跳过
当205ms处添加的定时器代码执行完毕以后
立刻执行405ms处的定时器代码在
然后在805ms处添加定时期

依次类推

setTimeout(function(){

},1000);

就是等待1000ms 如果任务队列没有代码执行了 是空的
就立刻执行 否则等待执行完毕

所以用setTimeout链式调用

setTimeout(function(){

// 代码

setTimeout(arguments.caller,delay);

},delay);

这样就没事了
每次添加新的定时器都是在代码执行完毕以后
至少等待delay

setInterval 和 setTimeout的更多相关文章

  1. JavaScript DOM 编程艺术·setInterval与setTimeout的动画实现解析

    先贴上moveElement()函数的大纲,为了方便观看,删了部分代码,完整版粘到文章后面. function moveElement(elementID,final_x,final_y,interv ...

  2. JavaScript SetInterval与setTimeout使用方法详解

    setTimeout和setInterval的语法相同.它们都有两个参数,一个是将要执行的代码字符串,还有一个是以毫秒为单位的时间间隔,当过了那个时间段之后就将执行那段代码.不过这两个函数还是有区别的 ...

  3. JS里设定延时:js中SetInterval与setTimeout用法

     js中SetInterval与setTimeout用法 JS里设定延时: 使用SetInterval和设定延时函数setTimeout 很类似.setTimeout 运用在延迟一段时间,再进行某项操 ...

  4. 关于setInterval和setTImeout中的this指向问题

    前些天在练习写一个小例子的时候用到了定时器,发现在setInterval和setTimeout中传入函数时,函数中的this会指向window对象,如下例: var num = 0; function ...

  5. js-定时任务setInterval,setTimeout,clearInterval,clearTimeout

    setInterval()循环执行相应的方法 <script type="text/javascript"> setInterval("myInterval( ...

  6. Js setInterval与setTimeout(定时执行与循环执行)的代码(可以传入参数)

    最近在做项目时用到了定时执行的js方法,setInterval与setTimeout时间长了不用有些生疏了,所以自己总结了一下,记下来,以便以后使用. Document自带的方法: 循环执行:var ...

  7. webapp 慎用setInterval、setTimeout

    其实这片文章刚开始我啥也没写的,但也有20多的访问量,所以觉得大家还是比较关注这个问题,所以找机会写下. 问题的引出: 为什么我说的时webapp中慎用setInterval.setTimeout, ...

  8. js学习--浏览器对象计时器setInterval()与setTimeout()的使用与区别

    一.setInterval()与setTimeout()的定义: 二.setInterval()与setTimeout()的使用:    1.setInterval()与clearInterval() ...

  9. js定时器setInterval()与setTimeout()

    js定时器setInterval()与setTimeout() 1.setTimeout(Expression,DelayTime),在DelayTime过后,将执行一次Expression,setT ...

随机推荐

  1. javascript的单例/单体模式(Singleton)

    首先,单例模式是对象的创建模式之一,此外还包括工厂模式.单例模式的三个特点:1,该类只有一个实例2,该类自行创建该实例(在该类内部创建自身的实例对象)3,向整个系统公开这个实例接口 Java中大概是这 ...

  2. [BZOJ 4350]括号序列再战猪猪侠 题解(区间DP)

    [BZOJ 4350]括号序列再战猪猪侠 Description 括号序列与猪猪侠又大战了起来. 众所周知,括号序列是一个只有(和)组成的序列,我们称一个括号 序列S合法,当且仅当: 1.( )是一个 ...

  3. js深复制

    一般来讲深复制主要是为了复制js对象中的引用类型,引用类型在普通的赋值操作下相当于是引用,修改复制对象也会影响原对象,简单的方法的话可以使用JSON.parse(JSON.stringify(obj) ...

  4. Tesseract-OCR 3.05 多过语言文字识别(运行程序+中英日韩语言包)

    最新版本 静态编译 tesseract 3.05.00dev leptonica-1.73 libgif 5.1.3 : libjpeg 8c : libpng 1.6.16 : libtiff 3. ...

  5. Jenkins与代码上线解决方案

    Jenkins是一个用Java编写的开源的持续集成工具.在与Oracle发生争执后,项目从Hudson项目独立. Jenkins提供了软件开发的持续集成服务.它运行在Servlet容器中(例如Apac ...

  6. 获取同一接口多个实现类的bean

    @Service("taskExecutorFactory") public class TaskExecutorFactory implements ApplicationCon ...

  7. centos7切换启动内核

    1.查看当前系统内核 uname -r 3.18.6-2.el7.centos.x86_64 查看可使用的内核列表 awk -F\' '$1=="menuentry " {prin ...

  8. 使用管道和cronolog切割日志

    安装cronolog git clone https://github.com/fordmason/cronolog ./configure make && make install ...

  9. Webpack vs Gulp

    Webpack vs Gulp 谁会被拍死在沙滩上   本文组织结构 理想的前端开发流程 Gulp 为何物 Webpack 又是从哪冒出来的 结论 文章有点长,总共 1800 字,阅读需要 18 分钟 ...

  10. window下的窗口事件-js

    window.onfocus = function(){ // 窗口获取焦点事件}; window.onblur= function(){ // 窗口失去焦点事件};有弊端,亲测. 所以我还有一个更好 ...