Class

/**
 * @author ydq
 * @date 2019/05/28
 * @description 公共事件锁
 */
class _Locker {
    _locker: any = { key: false };
    _timeOut: any = { key: false };

    clear(): void {
        this._locker = { key: false };
    }

    // 获取锁状态
    get(key: string): boolean {
        return this._locker[key];
    }
    // 锁
    lock(key: string): boolean {
        this._locker[key] = true;
        return true;
    }
    // 解锁
    unlock(key: string): boolean {
        this._locker[key] = false;
        return false;
    }

    /**
     * 可以自动解锁的 锁
     * 获取 key锁 的状态
     * 如果 没有锁 则上锁,并在 500 毫秒后自动解锁
     * 如果 在锁 则返回上锁状态
     * @param {*} key
     * @param {*} time
     */
    autoLocker(key: string, time = 500): boolean {
        let _res = !!this._locker[key];
        if (_res === false) {
            this._locker[key] = true;
            clearTimeout(this._timeOut[key]);
            this._timeOut[key] = setTimeout(() => {
                this._locker[key] = false;
            }, time);
            return false;
        }
        return true;
    }
}

export default new _Locker();

使用实例

import Locker from './Locker';
ClickAgain() {
        // 2s 内不会多次触发事件
        if (Locker.autoLocker('event:locker:ClickPlayAgain', 2000)) return;
}
Unlock(){
    Locker.get("key") // 返回 false

    Locker.lock("key") // 加锁

    Locker.get("key") // 返回 true

    Locker.unlock("key") // 解锁

    Locker.get("key") // 返回 false
}

作用

  1. 事件的防抖动处理
  2. 事件调用频率限制
  3. ...

标题:Typescript 小工具 ---- 事件锁类
作者:K
地址:https://pala.icu/articles/2021/10/08/1633665281897.html