谁能给我一个简单的解释,关于节流和debounging函数之间的区别,以限制速率的目的。

在我看来,两者的作用是一样的。我查看了这两个博客来找出答案:

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

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


当前回答

油门(1秒):你好,我是机器人。只要你一直打我,我就会继续和你说话,但每次一秒后。如果你在一秒之前ping我的回复,我仍然会在1秒的间隔内回复你。换句话说,我就是喜欢隔一定的时间间隔回复。

弹跳(1秒):嗨,我是那个^^机器人的表弟。只要你一直ping我,我就会保持沉默,因为我喜欢在你最后一次ping我一秒钟后才回复。我不知道,是因为我的态度有问题还是因为我不喜欢打断别人。换句话说,如果您在上次调用后的1秒内一直向我请求回复,您将永远不会得到回复。是的是的…去吧!说我粗鲁就好。


节流阀(10分钟):我是一台伐木机。我将系统日志发送到我们的后端服务器,每隔10分钟。

反弹(10秒):嗨,我不是那台伐木机的表亲。(在这个想象的世界中,并不是每个脱锁器都与节流器有关)。我在附近一家餐馆当服务员。我应该让你知道,只要你一直在你的订单中添加东西,我就不会去厨房执行你的订单。只有在您上次修改订单后10秒后,我才会认为您已经完成了订单。到那时我才会去厨房执行您点的菜。


酷演示:https://css-tricks.com/debouncing-throttling-explained-examples/

服务员类比的功劳:https://codeburst.io/throttling-and-debouncing-in-javascript-b01cad5c8edf

其他回答

debound使函数只能在最后一次调用后的一段时间后执行

function debounce(func,wait){
  let timeout
  return(...arg) =>{
    clearTimeout(timeout);
    timeout= setTimeout(()=>func.apply(this,arg),wait)
  }
}


function SayHello(){
  console.log("Jesus is saying hello!!")
}


let x = debounce(SayHello,3000)
x()

节流模式限制了在一段时间内可以调用给定事件处理程序的最大次数。它允许以指定的时间间隔周期性地调用处理程序,忽略该等待期结束之前发生的每个调用。

function throttle(callback, interval) {
  let enableCall = true;

  return (...args)=> {
    if (!enableCall) return;

    enableCall = false;
    callback.apply(this, args);
    setTimeout(() => enableCall = true, interval);
  }
}


function helloFromThrottle(){
  console.log("Jesus is saying hi!!!")
}

const foo = throttle(helloFromThrottle,5000)
foo()

deboning和throttle之间的主要区别在于,debounce在用户未在特定时间内执行事件时调用函数,而throttle在用户执行事件时以指定时间间隔调用函数。

我个人认为反弹比油门更难理解。

因为这两个函数都可以帮助您延迟和降低某些执行的速度。假设您正在调用由throttle/debounce反复返回的装饰函数…

节流:在指定的时间段内,原函数最多被调用一次。 Debounce:在指定的时间后,调用方停止调用被修饰的函数后,将调用原始函数。

我发现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的朋友,他喜欢通过IM和你聊天。假设当她说话时,她每5秒发送一条新消息,而你的即时通讯应用程序图标上下跳动,你可以…

Naive approach: check every message as long as it arrives. When your app icon bounces, check. It's not the most effective way, but you are always up-to-date. Throttle approach: you check once every 5 minutes (when there are new ones). When new message arrives, if you have checked anytime in the last 5 minutes, ignore it. You save your time with this approach, while still in the loop. Debounce approach: you know Chatty, she breaks down a whole story into pieces, sends them in one message after another. You wait until Chatty finishes the whole story: if she stops sending messages for 5 minutes, you would assume she has finished, now you check all.

节流

节流强制一个函数可以被调用的最大次数 加班。就像“每100次执行一次这个函数 毫秒。”假设在正常情况下你会这样做 在10秒内运行1000次。如果你把它控制在一次 每100毫秒,它最多只执行该函数100次 次

(10s * 1,000) = 10,000ms
10,000ms / 100ms throttling = 100 maximum calls

消除抖动

撤销强制函数不再被调用,直到 一段时间过去了,它还没有被调用。就像在 “只有在100毫秒之后才执行这个函数 被称为”。

也许一个函数在短时间内被调用1000次,分散在3秒内,然后停止被调用。如果您在100毫秒时将其解除,则该函数只会在爆发结束后的3.1秒内触发一次。每次在爆发期间调用该函数时,它都会重置反弹计时器

来源:-油门和反弹

如何debound工作在硬件。

去噪是从数字信号中去除噪声的过程。当一个按钮被按下时,信号反弹会导致该按钮被注册为被按了多次。反弹消除了这种噪音,因此按钮只被记录为被按下一次。想象一把尺子在桌子边上弹跳,再想象开关里的金属触点像这样弹跳。

更好的是,看看这张图,显示了由弹跳引起的开关噪声。

我们使用适当计算额定值的电阻和电容来平滑信号n毫秒。

解释信号节流如何在硬件中工作。

信号节流是限制信号注册次数的过程。这通常用于防止一个按钮被注册为在短时间内被多次按下。

我更喜欢“门控”这个词,但那是因为我从事电子音乐制作。

我们在每个节流阀周期结束时打开闸门,并允许信号通过,然后再次关闭闸门,为下一个节流阀周期。

解释如何debounging工作在软件。

软件中的debound通常是通过使用定时器来实现的。当按钮被按下时,计时器开始。如果在计时器到期前再次按下按钮,计时器将被重置。这确保了按钮只能注册为每个弹跳周期被按下一次。

在debounce的许多实现中,我们创建了函数的debounce版本,该版本嵌入到包含计时器(或门)的闭包中。当计时器延迟过期时,我们再次将其设置为空。实际函数只在计时器为空时运行。通常,这意味着当我们第一次调用debpublished函数时,它将运行一次,然后对它的后续调用将有效地取消,直到延迟时间结束。

在debounce的某些实现中,当调用流被触发且计时器未过期时,计时器将重新启动。仅在反弹停止后调用该函数。这通常被称为尾随反弹。

解释在软件中节流是如何工作的。

软件中的节流通常是通过使用计数器来完成的。当按下按钮时,计数器增加。如果在计数器达到某一阈值之前再次按下按钮,计数器将复位。这限制了在给定的时间内按钮可以被注册为被按下的次数。最好把它想象成一个脉冲或节拍,当呼叫被发送到油门时,它会打开和关闭一个门。

速率限制是考虑节流阀的另一种方式。

为什么这是造成困惑的常见原因?

在许多用例中,debounce或throttle将为您带来您想要的结果,特别是如果您正在使用的软件实现允许您链接、跟踪或引导您的throttle / debounce。

尽管如此,我希望这里所有的答案和这个问题都能帮助你更清楚地理解。

它们非常相似。