Throttle和Debounce

Throttle

节流，一定事件内只执行第1次操作，超过事件后可再执行

const throttle1 = new Throttle(3000);
for(let i=0;i<10;i++){
  throttle1.attempt(()=>{
    //此处3秒内只执行第1次
  });
}

throttle

快速创建Throttle对象（存在时会直接引用）
防止按钮300ms内重复点击示例

//点击多次，第1次触发，300ms秒内不再触发
myClick(e: Event): void{
 throttle(300, 'throttle_click').attempt(()=>{
     console.log("throttle execute");
  },event);
}

Debounce

防抖，一定时间内只执行最后1次操作，每次调用会延迟执行

const debounce1 = new Debounce(3000);
for(let i=0;i<10;i++){
  debounce1.attempt(()=>{
    //此处3秒内只执行最后1次
  });
}

debounce

快速创建debounce对象（存在时会直接引用）
滑动页面，延迟300ms最后一次触发发送某个请求（避免频繁发送）

//点击多次，第1次触发，300ms秒内不再触发
myClick(e: Event): void{
  debounce(300, 'debounce_click').attempt(()=>{
     console.log("debounce execute");
    },event);
}