Lodash防抖动防抖动不 [英] Lodash Debounce not debouncing

问题描述

我想防抖动功能使用Lodash ，虽然它的调用该函数，这不是'T似乎抖它。我的问题似乎并没有相同的错误，因为我在其他地方<一看到href=\"http://stackoverflow.com/questions/24306290/lodash-debounce-not-working-in-anonymous-function\">on SO 或谷歌（一般地，他们没有调用该功能_。去抖收益）。

我目前超级简单的实现如下（在角与CoffeeScript中）：

  s.search =  - ＆GT; _.debounce（s._makeSearchRequest，1000）（）  s._makeSearchRequest =  - ＆GT;的console.log（使搜索请求）
 

在JS，我相信这是：

  s.search =功能（）{_.debounce（s._makeSearchRequest，1000）（）}  s._makeSearchRequest =函数（）{的console.log（使搜索请求）}
 

我跑 s.search（）键入到输入框中，如果我非常快速输入胡言乱语，在控制台打印出每个按键使得搜索请求 preSS，每秒许多次 - 指示它没有被去抖在所有。

任何想法是我做错了吗？

解决方案

_。去抖的创建的是去抖的是传递给函数的函数它。你的 s.search 功能正在做的是呼吁 _。去抖从头再来每次 s.search 被调用。这将创建每次一个全新的功能，所以没有什么抖。

因此​​，解决方法是删除箭头和额外的对括号，并确保 s._makeSearchRequest 您访问之前定义：

  s._makeSearchRequest =  - ＆GT;的console.log（使搜索请求）s.search = _.debounce（s._makeSearchRequest，1000）
 

为例（使用JavaScript）：

\r

\r

变种S;\r
\r
S = {};\r
\r
s._makeSearchRequest =功能（）{\r
  返回snippet.log（使搜索请求）;\r
};\r
\r
s.search = _.debounce（s._makeSearchRequest，1000）;\r
\r
s.search（）;\r
\r
s.search（）;\r
\r
s.search（）;\r
\r
//在3秒后叫s.search\r
的setTimeout（s.search，3000）;\r
\r
//计时器显示的时间流逝\r
变种I = 0;\r
VAR T =的setInterval（函数（）{\r
    我+ = 1;\r
    snippet.log第（i +秒经过）;\r
    如果（ⅰ→5）{clearInterval（t）的; }\r
}，1000）;

\r

＆LT;脚本的src =// cdnjs.cloudflare.com/ajax/libs /lodash.js/3.5.0/lodash.min.js\"></script>\r
＆LT;！ - 提供了`snippet`对象，见http://meta.stackexchange.com/a/242144/134069 - ＆GT;\r
＆LT;脚本SRC =htt​​p://tjcrowder.github.io/simple-snippets-console/snippet.js＆GT;＆LT; / SCRIPT＆GT;

\r

\r

\r

I'm trying to debounce a function using Lodash, and while it's invoking the function, it doesn't seem to debounce it at all. My issue doesn't seem to be the same mistake as what I've seen elsewhere on SO or Google (generally, that they're not invoking the function that _.debounce returns).

My currently super-simple implementation is as follows (in Angular with CoffeeScript):

  s.search = -> _.debounce( s._makeSearchRequest, 1000 )()

  s._makeSearchRequest = -> console.log("making search request")

In JS, I believe that's:

  s.search = function() { _.debounce( s._makeSearchRequest, 1000 )() }

  s._makeSearchRequest = function() { console.log("making search request") }

I run s.search() by typing into an input box, and if I type gibberish very quickly, the console prints out "making search request" on every key press, so many times per second -- indicating that it hasn't been debounced at all.

Any ideas what's I'm doing wrong?

解决方案

_.debounce creates a function that debounces the function that's passed into it. What your s.search function is doing is calling _.debounce all over again every time s.search is called. This creates a whole new function every time, so there's nothing to debounce.

So the solution is to remove the arrow and the extra pair of parentheses, and make sure that s._makeSearchRequest is defined before you access it:

s._makeSearchRequest = -> console.log("making search request")

s.search = _.debounce( s._makeSearchRequest, 1000 )

Example (using JavaScript):

var s;

s = {};

s._makeSearchRequest = function() {
  return snippet.log("making search request");
};

s.search = _.debounce(s._makeSearchRequest, 1000);

s.search();

s.search();

s.search();

// call s.search after 3 seconds
setTimeout(s.search, 3000);

// timer to show passage of time
var i = 0;
var t = setInterval(function () {
    i += 1;
    snippet.log(i + " seconds elapsed");
    if (i > 5) { clearInterval(t); }
}, 1000);

<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/3.5.0/lodash.min.js"></script>
<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

这篇关于Lodash防抖动防抖动不的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！