防抖与节流

函数的防抖与节流

重要！重要！重要！（重要的事情说三遍！！！

1. 问题引入 - 卡顿现象

由于用户操作过快，且每一次的触发，回调函数都需去执行，这时候如果事件很短且回调函数内部有计算，很有可能出现浏览器卡顿现象的出现。

【解决办法：】

2. 防抖

防抖：前面的所有触发都被取消，最后一次执行在规定的时间之后才会触发。也就是说如果连续快速的触发，只会执行一次。

2.1 轻量三方库Lodash实现防抖

下载并引入lodash.js，注意lodash.js向外暴露的是一个下划线_。

_.debounce(func,[wait=0],[options=])防抖函数

注意这个的返回值是个函数，需要用变量接收然后再调用~

2.2 原生js实现防抖

3. 节流

节流：在规定的间隔时间范围内不会重复触发回调，只有大于这个时间间隔才会触发回调。也就是说把频繁触发变为少量触发。

3.1 轻量三方库Lodash实现节流

_.throttle(func,[wait=0],[options=])节流函数

3.2 原生js实现节流