js节流和防抖别看这一篇

  前言:我们在做页面事件绑定的时候,经常要进行节流处理,比如鼠标异步点击,去执行一个异步请求时,需要让它在上一次没执行时不能再点击,又或者绑定滚动事件,这种持续触发进行dom判断的时候,就要按一定频率的执行。

一、 伪理论:

     概念: 节流和防抖我认为都可以称之为节流。区别:防抖就是不想持续操作的节流,节流就是想固定频率执行的。
 节流:函数节流是指一定时间内js方法只跑一次。前一次没结束,后一次不会跑。比如滚动条这种持续按频率触发。
    防抖:函数防抖是指一定时间内js方法只跑一次。前一次没结束,后一次触发会按后一次的新间隔时间计算。比如按钮持续点击的限速。

二、原始的节流操作:



	
点我
点我2

 从上面我们可以进行简单的限流,但是存在一个问题,我们这个代码和事件函数严重耦合在一次,每个事件有节流需要,就需要在方法内固定的添加那几句代码,我可以惭愧的告诉你,我做的一个项目,里面节流基本全是这样手工一个一个加上去的。

  那么市面上有没有比较成熟的库中有这二个方法呢? underscore.js 就有现成的这二个方法。上面的测试二,就是调用此js的节流。

  三、underscore.js 的节流方法的源码阅读。


underscore实现防抖核心思路:是利用闭包函数返回作为执行函数,共享timeout参数进行标记判断,并且利用触发事件会共同操作时间戳timestamp 来重新用setTimeout方式递归调整新的启动时间。

你可能感兴趣的:(前端_old,underscore,js节流)