连续点击事件

使用手机的过程中，经常会连续快速点击按钮，然后手机反应不过来，出现了我们看似“死机”的现象。

我们会怪罪手机，认为手机性能不行，再要么就是网络不行，可除了这2点，就没有别的方法优化了吗？

其实出现上述现象，是因为多次点击导致触发了两次或者以上的点击事件，前端一旦处理较多的点击事件，想当然性能就没那么好啦。

通常我们解决这个问题，是在事件回调函数开始执行时，设置一个flag，将按钮设为“不可点击”状态，然后等到回调执行结束，再将按钮置为“可点击”状态。

但是前端页面一般都存在着大量的按钮，每个按钮都要设置flag的话很麻烦，而且代码看起来也冗余。

所以我们可以试试函数去抖动。

函数去抖动

函数去抖动的原理很简单：利用定时器，设置时间间隔。

例如让函数执行延迟500毫秒，在500毫秒内如果有函数又被调用则删除上一次调用，这次调用500毫秒后执行，如此往复。

就是当你停止输入500毫秒后才会执行函数，所以如果你在500毫秒间隔内连续触发回调函数，最后只会执行最后一次触发的函数。

节流

与函数去抖动相关联的就是节流。

节流是预先设定一个执行周期，当调用动作的时刻大于等于执行周期的时候，就执行该动作，然后进入下一个新周期，也就是每隔一个周期函数才会执行。

拿onscroll事件来说，如果使用的是抖动的话，只用当滚动停止后才会执行回调函数，在滚动的过程中是不会执行的。

而节流不同，滚动的时候每隔一个时间周期就会执行一次回调，然后进入下一个新周期。