关于防抖与节流的思考

百度防抖与节流，一直没搞懂防抖与节流的区别，然后google了一下，（google大法好

 _(:з」∠)_）个人理解了一下

  1，比较正式的解释他们的区别：

          防抖：就是指触发事件后在 n 秒内函数只能执行一次，如果在 n 秒内又触发了事件，则会重新计算函数执行时间，防抖注重结果

           节流：:是让一个函数无法在很短的时间间隔内连续调用，当上一次执行完之后过了规定的时间间隔，才能进行下一次的函数调用，节流注重过程

  2，非官方解释

          防抖：a打了一个b一下，b开始哭（假设哭5分钟），在这5分钟内a一直打，而b就只为哭a打的第一下，其他的从第二次开始，b就像练了金钟罩一样，抗打ƪ(˘⌣˘)ʃ，但是这5分钟过了之后金钟罩没了，需要a重新打一次，让b哭出来才重新生成金钟罩

          节流：这就有点像鬼畜了，a一直打，b一直哭，但是每次都是重新哭，类似于诸葛亮说 ‘竟然有如此厚颜无耻之人’，那么我们在暂停与播放之间快速切换就会出现 ‘竟然’  ‘竟然’  ‘竟然’  ‘竟然’  ‘竟然’  ‘竟然’  ‘竟然’  ‘竟然’  ‘有如此厚颜无耻之人’；

  3，应用场景

         防抖：窗口 resize时，搜索时需要根据输入框中的内容发送ajax请求时。。。。。。

         节流：滚动条到达底部（比如要做加载更多）。。。。。。

 4，程序实现：

//节流
   let time;
   let per = 200; //这个是间隔时间，即事件触发到事件回调开始执行的间隔时间。根据业务需求决定
    function throtting(){
     if(time){
   cleartimeout(time)
}
    time = settimeout(function(){
   //事件回调的具体方法

},per)

}
//防抖
   let timelength=2000;//即在2秒内自第二次开始的其他事件触发都将被忽略
   let lasttime = null;//上一次执行的时间点
   function debounce(){
     if(!lasttime){
lasttime = new date().gettime()
   }else{
     let curenttime=new date().gettime();
    if(curenttime - lasttime>2000){
 //事件回调的具体方法
   //需将上一次的时间更新↓
     lasttime = curenttime 

}else{
  //时间不够，不做任何操作
return false

}

}
     

}