防抖和节流

防抖：就是一定时间内，只会执行最后一次任务

    //防抖debounce代码：
function debounce(fn, delay) {
        var timeout = null; // 创建一个标记用来存放定时器的返回值
        return function(e) {
            // 每当用户输入的时候把前一个 setTimeout clear 掉
            clearTimeout(timeout);
            // 然后又创建一个新的 setTimeout, 这样就能保证interval 间隔内如果时间持续触发，就不会执行 fn 函数
            timeout = setTimeout(() => {
                fn.apply(this, arguments);
            }, delay);
        };
    }
input.addEventListener('click', debounce(handle,5000));

节流：就是一定时间内，只执行一次 

 //节流throttle代码：
 function throttle(fn, delay) {
        let canRun = true; // 通过闭包保存一个标记
        return function() {
            // 在函数开头判断标记是否为true，不为true则return
            if (!canRun) return;
            // 立即设置为false
            canRun = false;
            // 将外部传入的函数的执行放在setTimeout中
            setTimeout(() => {
                // 最后在setTimeout执行完毕后再把标记设置为true(关键)表示可以执行下一次循环了。
                // 当定时器没有执行的时候标记永远是false，在开头被return掉
                fn.apply(this, arguments);
                canRun = true;
            }, delay);
        };
    }
window.addEventListener("resize", throttle(sayHi, 500));