在前端開發(fā)中會遇到一些頻繁的事件觸發(fā)，比如：

• window 的 resize、scroll
• mousedown、mousemove
• keyup、keydown
  這會導致綁定的函數(shù)頻繁地執(zhí)行。
  為了防止太過于頻繁地執(zhí)行綁定的函數(shù)，我們一般有兩種解決方法：
• 1、debounce 防抖
• 2、throttle 節(jié)流

防抖

防抖的原理是：在事件觸發(fā)n秒之后才執(zhí)行函數(shù)，如果在n秒之內，又觸發(fā)了這個事件，則以新的時間為準，n秒后再執(zhí)行?？傊?，就是要觸發(fā)事件n秒之內不再觸發(fā)，才會執(zhí)行。

function debounce(func, wait) {
    var timeout;
    return function () {
        var context = this;
        var args = arguments;
        clearTimeout(timeout)
        timeout = setTimeout(function(){
            func.apply(context, args)
        }, wait);
    }
}

節(jié)流

節(jié)流的原理：如果持續(xù)觸發(fā)事件，每隔n秒執(zhí)行一次事件。
有兩種方式實現(xiàn)節(jié)流：1、時間戳；2、定時器
時間戳：

function throttle(func, wait) {
    var context, args;
    var previous = 0;

    return function() {
        var now = +new Date();
        context = this;
        args = arguments;
        if (now - previous > wait) {
            func.apply(context, args);
            previous = now;
        }
    }
}

定時器：

function throttle(func, wait) {
    var timeout;
    var previous = 0;

    return function() {
        context = this;
        args = arguments;
        if (!timeout) {
            timeout = setTimeout(function(){
                timeout = null;
                func.apply(context, args)
            }, wait)
        }

    }
}