首页 > 代码库 > javascript函数节流(throttle)与函数去抖(debounce)

javascript函数节流(throttle)与函数去抖(debounce)

throttle 等时间 间隔执行函数。

debounce 时间间隔 t 内若再次触发事件,则重新计时,直到停止时间大于或等于 t 才执行函数。

1、throttle函数的简单实现

function throttle(fn, threshhold, scope) {     threshhold || (threshhold = 250);     var last, timer;     return function () {        var context = scope || this;         var now = +new Date(),             args = arguments;         if (last && now - last + threshhold < 0) {             // hold on to it             clearTimeout(deferTimer);             timer = setTimeout(function () {                 last = now;                 fn.apply(context, args);             }, threshhold);         } else {             last = now;             fn.apply(context, args);         }     };}//调用方法$(‘body‘).on(‘mousemove‘, throttle(function (event) {    console.log(‘tick‘);}, 1000));

2、debounce函数的简单实现

function debounce(fn, delay) {     var timer = null;     return function () {         var context = this,        args = arguments;         clearTimeout(timer);         timer = setTimeout(function () {             fn.apply(context, args);         }, delay);     };}//调用方法$(‘input.username‘).keypress(debounce(function (event) {// do the Ajax request}, 250));

转自:http://www.cnblogs.com/fsjohnhuang/p/4147810.html

javascript函数节流(throttle)与函数去抖(debounce)