去抖不起作用答案

【问题标题】：Debouncing not working去抖不起作用
【发布时间】：2013-05-17 19:21:00
【问题描述】：

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/

介意检查我是否做错了吗？

【问题讨论】：

你永远不会调用函数！而计时器变量并没有按照你的想法做。

标签： javascript debouncing

【解决方案1】：

您的代码应如下所示

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

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

在您的示例中，您从不调用返回的函数，它总是在创建一个新函数。

根据您的评论。如何在不同的上下文中使用它。以下示例将向控制台写入 10 次foo，但只会添加一个时间戳。

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 返回一个函数但不执行它。您必须只调用 _.debounce 一次。如果你想多次调用你的去抖动函数，你必须存储函数的 _.debounce 包装版本并调用这个存储的版本。（这些是我从这个答案中学到的对我有帮助的教训）

【解决方案2】：

你必须调用函数，从debounce返回。把代码改成

$('input').keyup( function() {
    console.log('k');
    this.func = this.func || debounce(f, 100);
    this.func.apply( this, Array.prototype.slice.call(arguments) ); 
});

【讨论】：

F 在 K 之后仍然被调用与 K 相同的次数。所以没有去抖动。但这很有趣。