防抖:限制执行次数,多次密集的触发只执行一次。
- 登录、发短信等按钮避免用户点击太快,以致于发送了多次请求,需要防抖;
- 调整浏览器窗口大小时,resize 次数过于频繁,造成计算过多,此时需要一次到位,就用到了防抖;
节流:限制执行频率,有节奏的执行。
- scroll 事件,每隔一秒计算一次位置信息等;
- 浏览器播放事件,每个一秒计算一次进度信息等;
- input 框实时搜索并发送请求展示下拉列表,每隔一秒发送一次请求 (也可做防抖);
节流关注“过程”,防抖关注“结果”。
实际工作中我们一般使用lodash库中的节流防抖函数(lodash.com)。