JS中的高頻事件有scroll recize mouseover。 如果頻繁觸發事件綁定函數，會導致瀏覽器性能上的損失。

因此我們通常會添加延遲執行的邏輯。

在underscore.js裏面有debounce和throttle這兩個方法。

throttle創建並返回一個節流閥一樣的函數，當重復調用函數的時候，至少每隔wait毫秒調用一次該函數。

var throttled = _.throttle(updatePosition, 100);
$(window).scroll(throttled);

debounce函數，去抖，是講延遲函數的執行在函數最後一次調用的wait毫秒之後，比如當窗口停止改變大小之後重新計算布局。

可以這樣理解，像彈簧一樣，只有你松開壓住彈簧的手，彈簧才會向上彈起。

也就是說當調用動作n毫秒後，才會執行該動作，若在這n毫秒內又調用此動作則將重新計算執行時間。

1 var lazyLayout = _.debounce(calculateLayout, 300);
2 $(window).resize(lazyLayout);

//簡單實現一個debonce
var debonce = function(fn,idle){
  var last = null;
  return function() {
    var ctx = this, args = arguments;
    clearTimeout(last);
    last = setTimeout(function(){
      fn.apply(ctx,args);
    },idle)  
  }       
}

JS debounce和throttle 去抖和節流