1.0.2 • Published 1 year ago

hmc-shake v1.0.2

Weekly downloads
-
License
ISC
Repository
-
Last release
1 year ago

hmc-shake:防抖

适用于对dom操作,执行延迟,重复延迟,防抖时间内跳过 防抖事件到达后执行

从安装开始

npm i hmc-shake

如何调用

// CommonJS (.cjs)
let shake = require("hmc-shake");

// TypeScript (.ts)
import shake = require("hmc-shake");

//ECMAScript (ejs) 
import shake from "hmc-shake";
import {shake} from "hmc-shake";
import {isset} from "hmc-shake";

基本函数

1. isset (是否有当前键值 如果有返回)
  • Key 使用该内容作为防抖键值 string | number
  • Timeout(可选) 当多少毫秒后移除该键值存在 ( 默认 无穷大 ) number
  • CallBack(可选) 键值被移除时候的回调
  • return boolean
// 键值被添加
shake.set(996);

if(shake.isset(996,1200)){
    console.log('icu');
}else{
    console.log("成功执行")
}

log => icu;

shake.del(996);
// 键值未被添加 或者超时
if(shake.isset(996,1200)){
    console.log('icu');
}else{
    console.log("成功执行")
}

log => 成功执行;
2. get (是否有当前键值 如果有返回 布尔)
  • key 键值 string | number
  • return boolean
shake.set(996);
if(shake.get(996))console.log("exists");
log=>exists
3. has (是否有当前键值 如果有返回 布尔)
  • key 键值 string | number
  • return boolean
shake.set(996);
if(shake.has(996))console.log("exists");
log=>exists
4. set (添加键值 和超时)
  • key 键值 string | number
  • Timeout(可选) 当多少毫秒后移除该键值存在 ( 默认 无穷大 ) number
  • CallBack(可选) 键值被移除时候的回调
  • return void
shake.set(996,1200);
if(shake.has(996))console.log("exists");
log=>exists
5. Const (添加键值 永不超时 除非移除)
  • key 键值 string | number
  • CallBack(可选) 键值被移除时候的回调
  • return void
shake.Const(996);
if(shake.has(996))console.log("exists");
log=>exists
6. remove(移除键值)
  • key 键值 string | number
  • return void
shake.remove(996);
if(!shake.has(996))console.log("not");
log=>not
7. del(移除键值)
  • key 键值 string | number
  • return void
shake.del(996);
if(!shake.has(996))console.log("not");
log=>not
8. GetSize(当前包含的键值数量)
  • return number
shake.set(996,1200);
console.log(shake.GetSize());
log=>1

shake.del(996);
console.log(shake.GetSize());
log=>0
9. ShakeList(当前包含的键值)
shake.set(996,1200);
console.log(shake.ShakeList);
log=>Set<996>

shake.del(996);
console.log(shake.GetSize());
log=>Set<>
10. nextTick(添加并等待键值移除)
  • key 键值 string | number
  • Timeout 当多少毫秒后移除该键值存在 ( 默认 无穷大 ) number
  • return void
let index = 0;
shake.nextTick(996,1200).then(()=>{
    index+=1;
}).catch(err=>{
	console.log("重复被添加")    
});

console.log(index);
log => 0

await shake.Sleep(1500);
console.log(index);
log => 1
11. on(键值变化监听)
  • key 键值 string | number
  • type 类型 "add" | "remove" | "has"
  • CallBack 回调函数
  • return void
shake.on("1","add",(type,time)=>{
    console.log(this,type,time)
})

shake.set(996,1200);
log=> Set<996...> , "add"  , 1200
12. Sleep(异步阻塞)
  • ms 阻塞事件 number
  • return Promise
;(async function (){
  setTimeout(()=>console.log('Timeout=>800'),800);
  console.log('shake=>not sleep');  
  await shake.Sleep(1200);
  console.log('shake.Sleep=>1200');  
})();
log=>"shake=>not sleep"
log=>"Timeout=>800"
log=>"shake.Sleep=>1200"
13.ID (随机的文本id)
  • return string
console.log(shake.ID())
log=>K9V7N7JXBL1D8

console.log(shake.ID())
log=>K9V7NDXH2KA63

console.log(shake.ID())
log=>L2NHOIH3SLUH8
14. Random(添加 随机超时的 键值)
  • key 键值 string | number
  • MinTimeout 超时时间范围起点
  • MaxTimeout 超时时间范围最大
  • return void
添加一个超时为 150ms 到 5000ms的键值
shake.Random(996,150,5000);

添加一个超时为 150ms 到 5000ms的键值
shake.Random(996,[150,5000]);
15. wait 当使用的键值存在时将返回一个 false 并拒绝回调
  • 通常用于存储一个数据 但是这个数据抖动的太厉害了(例如只需要一秒内存储一次)但是他的数据更新却在一秒内发生了上百次 io
shake.wait("wait-key",2500,50)?.then(()=>console.log("延迟执行 2500+50 (2550ms)"));
// 在 2500+50(2550ms)内的所有回调都将被忽略 不执行
shake.wait("wait-key",2500,function(){console.log('上次还没完成 被忽略 不执行')},50);
// 键值存在 无法产生一个异步对象 而是产生一个false 所以这个执行会报错 
shake.wait("wait-key",2500).then(()=>{});

// 延迟2555ms 后执行(键因超时移除了)
await shake.Sleep(2500+50+5);


// 用vue的数据监听并写入文件系统 举个例子

vm.$watch("openURL",newData=>{
    // 一秒内只存储一次 最快允许800(1000-200)ms内存储一次
    shake.wait("vm.upload.openURL",1000,200)?.then(()=>{
        // 存储数据
        store.Set("OpenURL",newData);
    });

});