调节和去除function之间的区别

任何人都可以给我一个关于节stream和去除速率限制目的函数之间区别的简单单词解释。

对我来说,两者似乎都是这样做的。 我已经检查了这两个博客找出:

http://remysharp.com/2010/07/21/throttling-function-calls

http://benalman.com/projects/jquery-throttle-debounce-plugin/

简单来说,

  • 节stream将延迟执行function。 它会减less多次触发事件的通知。
  • Debouncing会把一系列连续的调用集合到一个函数中。 它确保为发生多次事件的事件发出一个通知。

你可以直观的看到这里的区别

如果你有一个被调用的函数 – 例如当发生resize或鼠标移动事件时,可以调用很多次。 如果你不想要这个行为,你可以调节它,以便定期调用该函数。 去声明将意味着它被称为在一堆事件的结束(或开始)。

我个人觉得反弹油门更难理解。

由于这两个函数都可以帮助您推迟并降低某些执行的速度。 假设你正在调用油门/ debounce反复返回的装饰函数…

  • 油门 :每个指定的周期最多只能调用一次原始function。
  • 去抖动 :在指定时间,调用者停止调用装饰函数后调用原始函数。

我发现最后一部分的debounce至关重要,以了解它试图达到的目标。 我还发现一个老版本的_.debounce的实现有助于理解( https://davidwalsh.name/function-debounce )。

// Returns a function, that, as long as it continues to be invoked, will not // be triggered. The function will be called after it stops being called for // N milliseconds. If `immediate` is passed, trigger the function on the // leading edge, instead of the trailing. _.debounce = function(func, wait, immediate) { var timeout; return function() { var context = this, args = arguments; var later = function() { timeout = null; if (!immediate) func.apply(context, args); }; var callNow = immediate && !timeout; clearTimeout(timeout); timeout = setTimeout(later, wait); if (callNow) func.apply(context, args); }; }; 

一个牵强的比喻,但也许也可以帮助。

你有一个名叫Chatty的朋友喜欢通过即时通讯与你交谈。 假设当她说话时,她发送一个新的消息,每5秒,而你的IM应用程序图标上下跳动,你可以采取…

  • 天真的做法:只要到达,就检查每封邮件。 当你的应用程序图标反弹,检查。 这不是最有效的方法,但你总是最新的。
  • 节气门的方法:你每5分钟检查一次(当有新的)。 当新消息到达时,如果您在过去5分钟内随时检查,请忽略它。 你用这种方法节省时间,同时还在循环中。
  • 去抖动的方法:你知道Chatty,她把整个故事分解成几部分,然后一个接一个地发送出去。 你等到Chatty完成整个故事:如果她停止发送信息5分钟,你会认为她已经完成,现在你检查所有。

Debouncing允许你pipe理一个函数可以接收的调用的频率。 它将给定函数上发生的多个调用结合起来,从而忽略在特定持续时间到期之前发生的重复调用。 基本上去抖动确保只有一个信号发送可能发生多次的事件。

节stream限制function接收到的固定时间间隔的呼叫频率。 它用于确保目标函数不会比指定的延迟更频繁地被调用。 节stream是重复事件发生率的降低。

通俗地说:

Debouncing会阻止一个函数在被频繁调用的时候运行。 去抖动function只有确定不再被调用之后才会运行,此时它将只运行一次。 去背诵的实例:

  • 如果用户“停止input”,则自动保存或validation文本字段的内容:操作只会执行一次,之后确定用户不再键入(不再按键)。

  • logging用户放置鼠标的位置:用户不再移动鼠标,因此可以logging(最后一个)位置。

如果最近运行, 调节将简单地阻止function运行,而不pipe呼叫频率如何。 节stream的实际例子:

  • v-sync的实现基于节stream:如果自上次屏幕绘制后经过了16ms,屏幕将被绘制。 无论屏幕刷新function多less次,每16ms最多只能运行一次。

调节强制执行一个函数可以被随时调用的最大次数。 如“每100毫秒最多执行一次这个function”。

Debouncing强制一个函数不会被再次调用,直到经过一定的时间而没有被调用。 就像“只有经过100毫秒才执行这个函数而不被调用”。

REF

lodash图书馆build议下面的文章https://css-tricks.com/debouncing-throttling-explained-examples/其中详细解释了Debounce和;Throttle和它们的起源之间的区别

在一段时间内只是一个使去抖动调用通过function 去抖动的包装器,如果去抖延迟function调用的时间大于在指定的时间段内