防抖与节流

export function debounce(fn, duration = 100) {
    let timer = null
    return (...args) => {
        clearTimeout(timer) // 清除定时器的时间
        timer = setTimeout(() => {
            fn(...args);
        }, duration) 
        // 只要点击的时间小于设定的定时器时间，
        // 就会执行上方的clearTimeout(timer)，
        // 定时器就会重新计时，定时器的内容也不会执行
    }
} // 防抖
export function throttle(fn, duration = 100) {
    let target = true;
    return (...arg) => {
        if (!target) {
            return false;
        }
        target = false;
        setTimeout(() => {
            fn(...arg);
            target = true
        }, duration) // 不管点击多少次，只要到达设定时间就会执行fn函数
    }
} // 节流

防抖：当你在点击一个按钮的时候添加了点击事件，你连续点击了10次，在没有加入防抖的时候，它应该会调用函数10次， 防抖的作用就是，不管你点击了这个按钮多少次，只有当你停下来的到了你设置的时间的时候，才会去执行你的点击函数；（即执行最后一次）

节流： 在固定的频率（定时器设置的时间）下只执行一次，不管点了几次，只会成功一次。