函数防抖

函数防抖（debounce），就是指触发事件后，在 n 秒内函数只能执行一次，如果触发事件后在 n 秒内又触发了事件，则会重新计算函数延执行时间。
举个栗子：

1. 搜索框输入完实时请求搜索
2. 用户名、手机号、邮箱等输入验证
3. 浏览器窗口大小改变后，窗口调整完后，再执行 resize 事件中的代码，防止重复渲染

function debounce(fn, wait) {
    let timer = null;
    return function () {
        if (timer !== null) {
            clearTimeout(timer);
        }
        timer = setTimeout(fn, wait);
    }
}

函数节流

指连续触发事件但是在 n 秒中只执行一次函数。即 2n 秒内执行 2 次… 。节流如字面意思，会稀释函数的执行频率。
举个栗子：

1. 页面滚动判断

// func要执行的函数  wait执行间隔的时间  immediate是否立即执行
function throttle(fn, interval = 300) {
    let canRun = true;
    return function () {
        if (!canRun) return;
        canRun = false;
        setTimeout(() => {
            fn.apply(this, arguments);
            canRun = true;
        }, interval);
    };
}

标签：function,防抖,函数,canRun,timer,执行,fn,节流
来源： https://blog.csdn.net/LittlePoem/article/details/118722446