函数的节流和防抖（原生js实现节流和防抖）

函数的节流与防抖

主要作用在于性能优化。

节流(throttle)：

在规定的单位时间段内，函数只能执行一次，在单位时间内多少触发，则只有一次有效。

举个例子：形象的说就是疫情期间必须一个一个排队做核酸，不然只能对志愿者说(你不要过来啊~~~)。

采用的方法：用两个时间相减，如果差值大于等于我们设置的时间值，才会调用函数。

防抖(debounce)：

事件被触发时，在n秒后执行函数，在n秒内多次触发事件，则重新开始计时。

举个例子：当你打游戏回城时，当被别人打断时(你干嘛~~)，只能乖乖重新回城了。

采用的方法：利用定时器来实现，在n秒内多次触发，则先清除定时器，重新计时。

适用场景

1. 节流

   1. 鼠标不断的点击，用节流来限制只在规定的单位时间内执行一次函数
   2. 滚轮事件, 不断的往下滚轮，比如滚动到底部加载数据

2. 防抖

   1. 不断的触发window的resize事件，不断的改变窗口大小，利用防抖函数来只执行一次
   2. 搜索框输入，每次输入完毕n秒后返送请求，如果期间再次输入，将会重新计算请求时间

扩展补充一下Lodash实现节流和防抖

可以点击查看Lodash中文文档