js 节流(throttle)和防抖(debounce)

// 节流
// 思路： 第一次先设定一个变量true，
// 第二次执行这个函数时，会判断变量是否true，
// 是则返回。当第一次的定时器执行完函数最后会设定变量为flase。
// 那么下次判断变量时则为flase，函数会依次运行。
function throttle(fn, delay = 100) {
    //首先设定一个变量，在没有执行我们的定时器时为null
    var timer = null;
    return function() {
        //当我们发现这个定时器存在时，则表示定时器已经在运行中，需要返回
        if (timer) return;
        timer = setTimeout(() => {
            fn.apply(this, arguments);
            timer = null
        }, delay)
    }
}

// 防抖
// 首次运行时把定时器赋值给一个变量， 第二次执行时，
//  如果间隔没超过定时器设定的时间则会清除掉定时器， 
//  重新设定定时器， 依次反复， 当我们停止下来时，
//  没有执行清除定时器， 超过一定时间后触发回调函数。
function debounce(fn, delay = 100) {
    var timer = null;
    return function() {
        if (timer) clearTimeout(timer)
        timer = setTimeout(() => {
            fn.apply(this, arguments);
            timer = null
        }, delay)
    }
}