函数防抖与节流

函数防抖与节流是很相似的概念，但它们的应用场景不太一样。

函数防抖:

任务频繁触发的情况下，只有任务触发的间隔超过指定间隔的时候，任务才会执行。
实现思路：
通过闭包保存一个标记来保存 setTimeout 返回的值，每当用户输入的时候把前一个 setTimeout clear 掉，然后又创建一个新的 setTimeout，这样就能保证输入字符后的 interval 间隔内如果还有字符输入的话，就不会执行 fn 函数了。

function debounce(fn, interval = 300) {
    let timeout = null;
    return function () {
        clearTimeout(timeout);
        timeout = setTimeout(() => {
            fn.apply(this, arguments);
        }, interval);
    };
}

函数节流:

任务频繁触发的情况下，只有任务触发的间隔超过指定间隔的时候，任务才会执行。函数节流所做的工作就是每隔一段时间去执行一次原本需要无时不刻地在执行的函数。

有点像玩游戏时的技能冷却

    function fn(){}
    var cd = false;
    button.onclick = function(){
        if(cd){
        //冷却中
        console.log('技能冷却中')
        }else{
            fn()
            cd = true
            //timerID在三秒后变为false 可以调用 fn
            var timerID = setTimeout(()=>{
            cd = false
           },3000)
        }
    }