js中防抖与节流的详解

认识防抖和节流

 在开发过程中，我们经常会需要绑定一些持续性触发的事件，如scroll，resize，mousemove等等，但有些时候我们并不希望在事件持续触发过程中那么频繁地去执行相应的事件函数，这样太浪费性能。所以通过防抖和节流来限制事件频繁发生。

​ 就像以下这样，当输入框里的文字发生任何变化都会发送一遍请求，所以会在很短的时间那发送数量庞大的请求。所以这个时候就需要防抖和节流了

防抖（dabounce）
防抖的定义：

指触发事件后在n秒内函数只执行一次，如果n秒内又触发了这个事件，则会重新计算函数执行时间。

也就是说只有在某个时间段内，没有再次触发某个函数时，才真正调用这个函数。

####防抖的过程：

当事件触发时，相应的函数并不会立即被触发，而是会等待一定的时间；

当事件密集触发时，函数的触发会被频繁的推迟；

只有等待了一段时间也没有事件触发，才会真正的执行响应函数

防抖本质上就是以最后的操作为标准

有个有意思的比方是：此时此刻我们都在排队等公交，司机说必须等到坐满才会发车，这时候的参照标准就是最后一个人上车，公交车好比我们的js代码，最后一个人就充当我们的执行条件。

防抖的代码实现：
我们可以用setTimeout来实现防抖，代码如下：

//用定时器实现防抖
function debounce(fn, wait) {
    let timout = null;
    return functio