zoukankan      html  css  js  c++  java
  • 用setTimeout()替代setInterval()

    为什么要用setTimeout()替代setInterval()?

    应用场景:速度切换

    通过改变duration的值更改setTimeout()执行时间从而更改事件发生的速度。

    设置变量duration,在

    setInterval(() = {
    // 执行代码
    }, duration)

    中,当你调用setInterval()时,只调用一次duration,那么当你更改duration时,setInterval()无法读取新的变化后的duration值。

    如何用setTimeout()替代setInterval()?

    举个例子:

    let n = 0;
    let id = setInterval(() => {
      n+=1;
      output.innerText=n; // 输出n
      if(条件){
        window.clearInterval(id);
      }
    }, 100);


    用setTimeout()替代setInterval():

    let n = 0;
    setTimeout(function fn(){
      n+=1;
      output.innerText=n; // 输出n
      if(条件){
        setTimeout(fn, 500);
      }
    }, 100);


    添加变量duration后:

    let n = 0;
    let duration = 100; // 给duration赋初值
    setTimeout(function fn(){
      n+=1;
      output.innerText=n; // 输出n
      if(条件){
        setTimeout(fn, duration); // 在setTimeout()中(延时的)递归调用且不满足条件时,中断是默认的
      }
    }, duration);


    这样在调用setTimeout()时每次的都会读取duration,得到变化的新duration值。

    总体讲的还比较笼统,(先挖坑,后期填上)。

  • 相关阅读:
    多表模型
    母版,单表操作,双下划线模糊查询
    模板层
    视图层
    路由层
    orm
    浅谈cookie,sessionStorage和localStorage区别
    实现元素垂直居中的方法(补充)
    实现元素垂直居中的方法
    <a href="javascript:;"></a>
  • 原文地址:https://www.cnblogs.com/lynn-z/p/12989989.html
Copyright © 2011-2022 走看看