前端面试系列 - 防抖节流

防抖节流

是什么

防抖 ： 在事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时。
节流 ： 规定在一个单位时间内，只能触发一次函数。如果这个单位时间内触发多次函数，只有一次生效。

本质上都是前端对过高频率执行的限制。

理解：
防抖是公交车，等最后一个人上来之后再多等三分钟，每次有人上来就重新计时。

节流是地铁，五分钟内就只有这一班。

防抖代码实现

在事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时。

let timer;
function debounce(fn, delay) {
   
    clearTimeout(timer);
    timer = setTimeout(function(){
   
        fn();
    }, delay);
}

在上面的代码中，会出现一个问题，timer被放到了全局作用域中，我们应该用闭包将这个变量包裹在防抖函数内部。

function debounce(fn, delay) {
   
    let timer; // 维护一个 timer
    return function (