JavaScriptWeb前端之路

函数去抖debounce

2017-03-14  本文已影响36人  猫仔哦

1.什么是函数去抖

乘坐电梯时,一个人按下电梯进入电梯后,此时如果另一个人也按下了该层电梯,电梯不会运动,这种状态会一直持续到一段时间(waitTime)后无人按下该层电梯按钮。

2.为什么要使用函数去抖

执行过多的DOM操作可能导致浏览器挂起或崩溃,如resize和scroll这样的可能高频操作的事件。

为了防止这些问题,因此使用函数去抖。

3.怎么使用函数去抖

function debounce(fn, waitTime, context) {
 var timeId = null;

 return function() {
   clearTimeout(timeId);
   
   timeId = setTimeout(fn.bind(context), waitTime);
 };
}

4.应用

var self = this;
window.addEventListener('resize', debounce(resizeHandler, 1000, self));
上一篇下一篇

猜你喜欢

热点阅读