定时器——轮询(setTimeout、setInterval、requestAnimationFrame)

使用setTimeout

//开启轮询
const start = ()  => {
  const test = async () => {
      await clearTimeout(this.interval);
      console.log("开始轮询", "具体事件");
      this.interval = setTimeout(() => {
            test ();
      },this.times);
  };
  test ();
};

//关闭轮询
const end = () => {
    clearTimeout(this.interval);
}

使用setInterval

//开启轮询
const start = ()  => {
  const test = async () => {
      await clearInterval(this.interval);
      console.log("开始轮询setInterval", "具体事件");
      this.interval = setInterval(() => {
            f();
      },this.times);
  };
  test ();
};

//关闭轮询
const end = () => {
    clearInterval(this.interval);
}

使用setTimeout配合requestAnimationFrame

//开启轮询
const start = ()  => {
  const test = async () => {
      await clearTimeout(this.interval);
      console.log("开始轮询setTimeout-requestAnimationFrame", "具体事件");
      this.interval = setTimeout(() => {
            this.animationFrameID = requestAnimationFrame(test);
      },this.times);

    if (!this.animationFrameID) {
        this.animationFrameID = requestAnimationFrame(test);
    }
  };
  test ();
};

//关闭轮询
const end = () => {
    clearTimeout(this.interval);
    cancelAnimationFrame(this.animationFrameID)
}

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容