用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值。

 

总体讲的还比较笼统，（先挖坑，后期填上）。