Javascript 函数防抖和节流

防抖 debounce

例如 window的scroll、resize事件等 是触发比较高事件，频繁的触发和执行会大大的消耗内存，降低浏览器性能。

定义和实现：

function count() {
        content.innerHTML = num++;
};
//定义：
debounce(fn,wait)
//实现：
function debounce(count, wait) {
    let timeout;
    return function () {
        let context = this;
        let args = arguments;
        if (timeout) clearTimeout(timeout); 
        timeout = setTimeout(() => {
          count.apply(context, args)
        }, wait);
    }
}

xxx.onmousemove = debounce(count,1000);

所谓防抖，就是指触发事件后在 n 秒内函数只能执行一次。
如果在 n 秒内又触发了事件，则会重新计算函数执行时间。

节流（throttle） 所谓节流，就是指连续触发事件但是在 n 秒中只执行一次函数。节流会稀释函数的执行频率。

function throttle(count, wait) {
    var previous = 0;
    return function() {
        let now = Date.now();
        let context = this;
        let args = arguments;
        if (now - previous > wait) {
            count.apply(context, args);
            previous = now;
        }
    }
}
xxx.onmousemove = throttle(count,1000);