zoukankan      html  css  js  c++  java
  • js定时器及定时器叠加问题

             回武汉隔离的第二天打卡,武汉加油,逆战必胜!今天想和大家简单聊一下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)
          }

        

  • 相关阅读:
    javaScript 与JQuery 计算器练习
    git在java项目中配置.gitignore不生效的解决办法
    mysql8主从复制配置
    ES6的Promise实例
    常用正则表达式
    Redis在Windows环境下后台启动
    Redis数据操作命令 二
    Redis数据操作命令
    List集合学习笔记
    MyBatis学习链接
  • 原文地址:https://www.cnblogs.com/chysunny/p/12609844.html
Copyright © 2011-2022 走看看