引用：http://www.cnblogs.com/coco1s/p/5499469.html

防抖

简单来说，就是在resize或者scroll等操作特别频繁的时候，规定触发事件的频率，不要太频繁

• 设定计时器，setTimeout(func, wait)
• 如果在执行func之前，wait时间内就又有了新动作，则clearTimeout(timeout)清空计时器
• 直到wait时间内没有新动作了，才执行func

// 简单的防抖动函数function debounce(func, wait, immediate) {    // 定时器变量    var timeout;    return function() {        // 每次触发 scroll handler 时先清除定时器        clearTimeout(timeout);        // 指定 xx ms 后触发真正想进行的操作 handler        timeout = setTimeout(func, wait);    };}; // 实际想绑定在 scroll 事件上的 handlerfunction realFunc(){    console.log("Success");} // 采用了防抖动window.addEventListener('scroll',debounce(realFunc,500));// 没采用防抖动window.addEventListener('scroll',realFunc);

 

节流

防抖方式只有当动作停下才会执行函数，但是如果遇到图片滑动时懒加载、Ajax请求之类，我们想要在滑动同时进行加载时，可以规定一个最小加载时间。就是虽然没有停下，但是一旦到了这个时间，就会进行一次加载。

// 简单的节流函数function throttle(func, wait, mustRun) {    var timeout,        startTime = new Date();     return function() {        var context = this,            args = arguments,            curTime = new Date();         clearTimeout(timeout);        // 如果达到了规定的触发时间间隔，触发 handler        if(curTime - startTime >= mustRun){            func.apply(context,args);            startTime = curTime;        // 没达到触发间隔，重新设定定时器        }else{            timeout = setTimeout(func, wait);        }    };};// 实际想绑定在 scroll 事件上的 handlerfunction realFunc(){    console.log("Success");}// 采用了节流函数window.addEventListener('scroll',throttle(realFunc,500,1000));