JS定时任务封装(支持精确倒计时)

TypeScript 复制代码
/***
 * callback 定时任务回调函数,
 * time 任务执行的间隔时间,
 * config.accurate 是否是精准的定时任务,如果是,会自动修正定时器偏差。
 */
export default function (
    callback: () => void, 
    time: number, 
    config?: {
        accurate: boolean // 是否是精准的定时任务,如果是,会自动修正定时器偏差。
    }
) {
    let task: any = null

    const record = {
        startTime: 0,
        runTime: 0,
        offsetTime: 0
    }

    const run = () => {
        if (config?.accurate) {
            record.startTime = new Date().getTime()
        }
        task = setTimeout(() => {
            if (config?.accurate) {
                record.runTime = new Date().getTime()
                record.offsetTime = time - (record.runTime - record.startTime)
            } else {
                record.offsetTime = 0
            }
            // 必须先run,再执行callback,防止在callback中调用clearTask方法
            run()
            callback()
        }, time + record.offsetTime)
    }

    /**
     * 清除定时任务
     */
    const clearTask = () => {
        clearTimeout(task)
        task = null
    }

    /**
     * 启动定时任务
     * @param immediate 是否立即运行
     */
    const startTask = (immediate?: boolean) => {
        if (immediate) {
            callback()
        }
        clearTask()
        run();
    }

    return {
        clearTask,
        startTask
    }
}

使用、控制都很方便:

TypeScript 复制代码
// 初始化
const { clearTask, startTask } = useInterval(() => {
    // do something....

}, 1000)

// 启动
startTask()


// 清除
clearTask()


//重新启动
clearTask()
startTask()
相关推荐
eqwaak0几秒前
数据预处理与可视化流水线:Pandas Profiling + Altair 实战指南
开发语言·python·信息可视化·数据挖掘·数据分析·pandas
共享家952734 分钟前
QT-常用控件(一)
开发语言·qt
Y学院36 分钟前
实战项目:鸿蒙多端协同智能家居控制 App 开发全流程
开发语言·鸿蒙
天生我材必有用_吴用40 分钟前
Vue3 + VitePress 搭建组件库文档平台(结合 Element Plus 与 Arco Design Vue)—— 超详细图文教程
前端
liu****1 小时前
基于websocket的多用户网页五子棋(八)
服务器·前端·javascript·数据库·c++·websocket·个人开发
San301 小时前
深入理解 JavaScript 函数:从基础到高阶应用
前端·javascript·node.js
ttyyttemo1 小时前
Column,rememberScrollState,记住滚动位置
前端
dlraba8022 小时前
用 Python+OpenCV 实现实时文档扫描:从摄像头捕捉到透视矫正全流程
开发语言·python·opencv
芒果茶叶2 小时前
并行SSR,SSR并行加载
前端·javascript·架构
vortex52 小时前
解决 Kali 中 Firefox 下载语言包和插件速度慢的问题:配置国内镜像加速
前端·firefox·腾讯云