回武汉隔离的第二天打卡,武汉加油,逆战必胜!今天想和大家简单聊一下js定时器的问题。

1.setTimeout 延时器 在指定时间后执行一次,注意只会执行一次

    当然有的时候我们想用延时器做出定时器的效果,让它一直执行也可以,就是反复调用函数自身即可,代码如下: 

      fun();    

      function fun() {
        console.log(1)
        setTimeout("fun()",1000); //自身调用,重复执行
      }

  2.setInterval 定时器 在指定的时间间隔内重复的执行,如不清除,会一直执行下去

      setInterval(function () {

        console.log(1);

      },1000)

  3.值得注意的是在setTimeroutsetInterval的使用中,如果传入参数,那只能传入函数名:

      setInterval(fn,1000)

  4.下面问题来了,当我们在执行定时器的过程当中,会发现一件有趣的事情,那就是定时器会累加,看下面的例子: 

    当我们多次点击浏览器窗口时会发现,打印的速度越来越快,这就是我们所说的定时器累加。    

      var timer;
      document.onclick = function() {
        timer = setInterval(function(){
          console.log(1)
        },1000)
      }

    那么为什么会出现这样的情况呢?咱们举个例子,这就好像一个人每隔一秒钟使用一次打印机,点两下的话就相当于两个人去使用这个打印机,他们是同时进行的,因此每一秒打印会有多于原来两倍的速度。那么如何解决这个问题呢?

    定时器累加问题的解决:先清除定时器,再使用定时器。代码示例如下:

      var timer;
      document.onclick = function() {
        clearInterval(timer)
        timer = setInterval(function(){
          console.log(1)
        },1000)
      }

    

js定时器及定时器叠加问题的更多相关文章

  1. js清除未知定时器的方法

    js清除未知定时器的方法 在需要有实时性更新数据的项目中,我们经常会用到很多定时器,我们可能需要一个可以一次性清除所有定时器的方法,并且不通过指定ID一个一个去清除,以下提供两种解决方案:   1.定 ...

  2. JS中的定时器

    在JS中的定时器分两种: 1,setTimeout() 2,setInterval() setTimeout(): 只在指定时间后执行一次: function hello(){ alert('hell ...

  3. js 中的定时器

    在js中的定时器分两种:1.setTimeout() 2.setInterval() 1.setTimeOut() 只在指定时间后执行一次 /定时器 异步运行 function hello(){ al ...

  4. STM32 HAL库学习系列第4篇 定时器TIM----- 开始定时器与PWM输出配置

    基本流程: 1.配置定时器 2.开启定时器 3.动态改变pwm输出,改变值  HAL_TIM_PWM_Start(&htim4, TIM_CHANNEL_1); 函数总结: __HAL_TIM ...

  5. STM32(5)——通用定时器基本定时器

    1.STM32的Timer简介 STM32中一共有11个定时器,其中2个高级控制定时器,4个普通定时器和2个基本定时器,以及2个看门狗定时器和1个系统嘀嗒定时器. 其中系统嘀嗒定时器是前文中所描述的S ...

  6. JS如何利用定时器实现长按事件

    本篇文章由:http://xinpure.com/js-how-to-use-timer-press-event/ JS 原生事件并没有长按事件,但是我们可以利用一些原有的事件,来实现长按事件 任务需 ...

  7. JS高阶---定时器相关

    首先看几个问题: [主体] (1)定时器真的时定时执行的吗? 顺序验证: 测试结果: 接下来对上述代码做下修改,增加一个长时间工作的消耗,此时再来验证下定时器运行的精准度 结果如下: (2)定时器回调 ...

  8. 前端学习(十四)js回顾和定时器(笔记)

    回顾知识点:    作用域:        1.全局变量:在任何位置都可以使用的变量        2.局部变量:只能在函数内部使用的变量        3.闭包:子函数可以使用父函数的局部变量 -- ...

  9. 解决在JS中阻止定时器“重复”开启问题、Vue中定时器的使用

    1.问题描述 在一些需求开发中.需要设定软件提供服务的时间段(营业时间).这时可以选择定时器来实现.可以选择让定时器每隔一段时间检测当前时间是否在服务时间.到达服务时间.进入服务状态.未到服务时间.进 ...

随机推荐

  1. Yuchuan_linux_C 编程之八 文件操作相关函数

    一.整体大纲 st_mode整体介绍: st_mode详细介绍: 二. Linux文件操作相关函数 1. stat 作用:获得文件信息,也可以获取文件大小. 头文件 #include <sys/ ...

  2. java 几种锁实现

    public class SyncronizedTest { private int value = 1; private AtomicInteger value1 = new AtomicInteg ...

  3. java线程间的共享

    本次内容主要讲synchronized.volatile和ThreadLocal. 1.synchronized内置锁 线程开始运行,拥有自己的栈空间,就如同一个脚本一样,按照既定的代码一步一步地执行 ...

  4. 检测js对象是不是数组类型?

    面试时候被人问如何检测一个未知变量是不是数组类型,丢脸啊,老祖宗的脸都丢没了,这都不会,回家啃书本去吧!!! var a = [];方法一:Array.isArray([])  //true type ...

  5. for循环结合range使用方法

    range概念:表示一个数据范围 基本的语法格式:range(开始数据,结束数据(不包括结束数据),步长) 记住一个公式:下一个数据=开始数据+步长 步长:表示的是数据前后的间隔 OK,基本的概念和语 ...

  6. 什么是SSH与SSH客户端

    1.什么是SSH? SSH 为 Secure Shell 的缩写,由 IETF 的网络工作小组(Network Working Group)所制定:SSH 为建立在应用层和传输层基础上的安全协议.SS ...

  7. Flask HTTP请求与响应

    设置请求 POST GET 设置post和get,在route中设置methods参数,除了post,get,还有put ,delete 等 @app.route('/http_test', meth ...

  8. oracle12c数据库第一周小测验

    一.单选题(共4题,30.4分) 1 (  )是位于用户与操作系统之间的一层数据管理软件.数据库在建立.使用和维护时由其统一管理.统一控制.   A. A.DBMS B. B.DB C. C.DBS ...

  9. javaScript 基础知识汇总 (十二)

    1.属性的标志和描述符 属性的标志 对象属性除value外还有三个特殊属性,即标志 writable ----如果为true,则可以修改,否则它只是只读的. enumerable ----如果为tru ...

  10. MySQL设置外键报错 #1452 - Cannot add or update a child row: a foreign key constraint fails 解决方法

    MySQL数据库,当我尝试在A表中设置B表的主键为外键时,报出错误:#1452 - Cannot add or update a child row: a foreign key constraint ...