在运行时更改 settimeout 延迟时间

Question

我想更改或更新 setimeout 延迟时间运行。我已经通过使用 debounceTime() 作为替代方法进行了验证。但是需要找到如何更新之前提到的创建新延迟time.instead。

在上面的代码片段中，我提到延迟为 10 秒。但是我的需要是在触发鼠标事件时启动此settimeout之后我需要更新延迟时间，而settimeout是运行。

请指教。谢谢

Answer 1

您可以创建一个Timer class来提供帮助。请看下面implementation。 Timer.start 开始计时。如果你想改变一些数据和re-run。然后使用Timer.interrupt。它将再次使用 delta 和运行函数。你可以修改你的逻辑。

class Timer {
  constructor(cb, ms = 2000) {
    this._ms = ms;
    this.ms = ms;
    this.cb = cb;
    this.timer = null;
    this.startedAt = null;
  }
  start() {
    this.startedAt = new Date().getTime();
    clearTimeout(this.timer);
    console.log("started");
    this.timer = setTimeout(() => {
      this.cb();
    }, this._ms);
  }
  intrupt() {
    const timeSpends = new Date().getTime() - this.startedAt;
    const timeLeft = this.ms - timeSpends;
    if (timeLeft > 0) {
      this._ms = timeLeft;
      this.start();
    }
  }
}
console.time("TIME");
let counter = 0;
const timer = new Timer(() => {
  console.timeEnd("TIME");
  console.log("counter: ", counter);
});

timer.start();
setTimeout(function cancel() {
  counter++;
  timer.intrupt();
}, 1000);

在运行时更改 settimeout 延迟时间

Changing setimeout delay time while its running

javascript

typescript

angular

rxjs6

在 运行 时更改 settimeout 延迟时间

Changing setimeout delay time while its running

javascript

typescript

angular

rxjs6

在运行时更改 settimeout 延迟时间