• 【javascript】定时器组件


    'use strict';
    module.exports = function() {
        this.timer = {};
        this.config = {};
        // 初始化参数
        this.init = function(opts) {
            var id = opts.id;
            this.config[id] = opts;
            this.config[id].interval = this.config[id].interval || 1;
            this.config[id].begin = opts.begin || 0;
            this.config[id].end = opts.end || 0;
            this.config[id].step = opts.step || 1;
            this.config[id].type = opts.begin < opts.end ? 1 : 0;
            this.clear([id]);
            this.start(id);
        };
        // 开启定时器
        this.start = function(id) {
            var self = this;
            var type = this.config[id].type;
            var interval = this.config[id].interval;
            var step = this.config[id].step;
            var cb = this.config[id].callback;
            // 先执行一次回调
            cb && cb(this.config[id].begin);
            type ? this.config[id].begin += step : this.config[id].begin -= step;
            this.timer[id] = setInterval(function() {
                self.loop(id);
            }, interval * 1e3);
        };
        this.loop = function(id) {
            var begin = this.config[id].begin;
            var end = this.config[id].end;
            var step = this.config[id].step;
            var cb = this.config[id].callback;
            var endFunc = this.config[id].endFunc;
            cb && cb(this.config[id].begin);
            if (this.config[id].type) {
                if (begin > end) {
                    this.clear([id]);
                    endFunc && endFunc();
                } else {
                    this.config[id].begin += step;
                }
            } else {
                if (begin < end) {
                    this.clear([id]);
                    endFunc && endFunc();
                } else {
                    this.config[id].begin -= step;
                }
            }
        };
        // 更新定时器参数
        this.update = function(opts) {
            this.config[opts.id] = _.extend({}, this.config[opts.id], opts);
        };
        // 清除某个(多个或者全部)定时器
        this.clear = function(ids) {
            var self = this;
            if (ids && ids.length) {
                _.each(ids, function(id) {
                    clearInterval(self.timer[id]);
                });
            } else {
                _.each(self.timer, function(v) {
                    clearInterval(v);
                });
            }
        };
    };

    参数说明

    • opts.id(String): 定时器id;
    • opts.interval(Number, 单位s, 默认1): 每次轮询时间,比如 1;
    • opts.callback: 回调函数;
    • opts.begin(Number): 起始值;
    • opts.end(Number): 终点值;
    • opts.step 递增/递减数值。
    • opts.endFunc 定时器结束后触发回调(新增)

    如何使用

    var timer = new Timer();
    timer.init({
        id: 'count',
        begin: 60,
        callback: function(count) {
            if (count >= 0) {
                // do something...
            }
        },
        endFunc: function() {
            // do something...
        }
    });

    PS

    _.each() 和 _.extend() 是 underscore.js 语法,有关 underscore.js 文档点此查看

  • 相关阅读:
    python3删除mysql上月分区数据(脚本)
    ansible之基本原理及命令
    centOS 7 简单设置(虚拟机)
    TCP_Wrappers 简介
    sudo
    引用数据应该选择 ID, CODE 还是 NAME
    吃得洒脱是一种什么体验
    通用数据同步机制
    我的学PyTorch之路(1)
    38岁才学会了游泳的心得
  • 原文地址:https://www.cnblogs.com/yjzhu/p/8778069.html
Copyright © 2020-2023  润新知