JS定时任务

1、js定时任务

描述：基于javascript、利用window.requestAnimationFrame实现的定时任务

/**
 * @desc: 定时任务
 * @author wangheng
 * @param pool: {} 存放所有任务的对象
 * @param taskId // 当前执行的requestAnimationFrame返回的ID
 * @function add 添加任务方法  remove 移除任务方法 start 开始方法  stop 停止定时任务方法
 * @date: 2019-07-02
 * @VERSION: 1.0
 */
const defaultInterval = 30000; // 默认时间间隔，单位：毫秒
const task = {
    defaultPool: {}, // 永远不会被清除的任务池
    pool: {},
    taskId: 0,
    addDefault: (name, fn, interval) => { // 调用此方法加入的任务执行start时候不会被清除
        task.defaultPool[name] = {
            name,
            fn,
            interval: interval || defaultInterval,
            excuteTime: 0,
        };
    },
    add: (name, fn, interval) => { // 调用此方法加入的任务执行start时候会被清除
        task.pool[name] = {
            name,
            fn,
            interval: interval || defaultInterval,
        };
    },
    remove: (name) => { // 根据任务名移除某个任务
        delete task.pool[name];
    },
    clearPool: () => { // 清空任务池
        task.pool = {};
    },
    excute: () => { // 执行定时任务方法
        task.taskId = window.requestAnimationFrame((ms) => {
            const usePool = { ...task.pool, ...task.defaultPool };
            Object.keys(usePool).forEach((key) => {
                const obj = usePool[key];
                if (ms - obj.excuteTime >= obj.interval) {
                    obj.fn();
                    obj.excuteTime = ms;
                }
            });
            task.excute();
        });
    },
    start: () => { // 任务开启方法
        task.pool = {};
        task.stop();
        window.requestAnimationFrame((ms) => {
            Object.keys(task.pool).forEach((key) => {
                task.pool[key].fn(); // 启动后先执行一次
                task.pool[key].excuteTime = ms;
            });
            task.excute();
        });
    },
    stop: () => { // 停止定时任务
        window.cancelAnimationFrame(task.taskId);
    },
};

调用方法：

function taskOne() {
	console.log('定时任务1');
}
task.start();
task.add('定时任务1', taskOne(),30000);