Debouncing не работает

Смотрите http://jsfiddle.net/5MvnA/2/ и консоль.

Должно быть меньше Fs, чем Ks, но вообще нет Fs.

Я получил код дебагинга

function debounce(fn, delay) {
  var timer = null;
  return function () {
    var context = this, args = arguments;
    clearTimeout(timer);
    timer = setTimeout(function () {
      fn.apply(context, args);
    }, delay);
  };
}

отсюда http://remysharp.com/2010/07/21/throttling-function-calls/

Не возражаете, если я делаю это неправильно?

2 ответа

Решение

Ваш код должен выглядеть так

$('input').keyup( function() {
    console.log('k');
});

$('input').keyup(debounce(f, 100));

В вашем примере вы никогда не вызываете возвращенную функцию, а она всегда создает новую функцию.


На основании вашего комментария. Как использовать это в другом контексте. Следующий пример напишет foo 10 раз в консоли, но добавит только одну временную метку.

function debounce(fn, delay) {
  var timer = null;
  return function () {
    var context = this, args = arguments;
    clearTimeout(timer);
    timer = setTimeout(function () {
      fn.apply(context, args);
    }, delay);
  };
}

function fnc () {
    console.log("Date: ",new Date());
}
var myDebouncedFunction = debounce(fnc, 100);

function foo() {
    console.log("called foo");
    myDebouncedFunction(); 
}

for ( var i=0; i<10; i++) {
    foo();
}

Вы должны вызвать функцию, возвращает из debounce, изменить код на

$('input').keyup( function() {
    console.log('k');
    this.func = this.func || debounce(f, 100);
    this.func.apply( this, Array.prototype.slice.call(arguments) ); 
});
Другие вопросы по тегам