rikdat/debounce.js

提供了防抖和节流的完善功能，实现了参数传递和对回调函数的事件对象绑定功能

//防抖：在n秒时间内，不停的被触发，只执行最后一次
export default function(func,delay){
  let id = null
  // 最后事件绑定的实际上是下面return的函数
  // question:为什么每次的函数调用都会使用同一个id？
  // answer:因为闭包具有记忆性，当闭包产生时，函数所处环境的状态会始终保持在内存中，不会在外层函数调用后被自动清除，因此这个id会一直存在(并且记住这个id在何处可用)
  return function(...args){
    // 定时器存在
    if(id){
      clearTimeout(id)
    }
    // 不存在时则设置一个定时器
    // 注意:setTimeout()的第一个参数需要的是一个函数名(不能带参数，若要带参数需要使用字符串调用)或者在这里定义一个函数，而不是函数调用
    // 定时器不会自动清除
    // id = setTimeout(function(){
    //   console.log(this);
    //   func()
    // }, delay);
    id = setTimeout(()=>{
      // 因为是箭头函数，所以这时的this就是外部函数中的this(绑定事件的this指向函数的调用者),也就是input标签，同时也能解决传参问题
      // 为了保证传入的func函数可以拿到事件对象,这里使用call()方法，并且单独传入e参数,那么func的形参中必须配置一个e形参
      func.call(this,...args)
    },delay)
  }
}