如何debound工作在硬件。

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

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

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

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

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

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

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

解释如何debounging工作在软件。

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

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

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

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

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

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

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

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

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

它们非常相似。

油门(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

节流强制在一段时间内可以调用函数的最大次数。就像“最多每100毫秒执行一次这个函数。”

deboundation强制函数不被再次调用，直到一段时间过去而没有被调用。就像“仅在100毫秒后未被调用时才执行该函数。”

ref

将debounce和throttle放在一起可能会非常令人困惑，因为它们都共享一个称为延迟的参数。

防反跳。延迟是等到不再有调用时，再调用它。就像关闭电梯门一样:门必须等到没有人试图进入时才能关闭。

节流。延迟是以一定的频率等待，然后调用最后一个。很像手枪射击，枪只是不能超过一定的射速。

让我们看一看实现的细节。

function debounce(fn, delay) {
  let handle = null
  
  return function () {
    if (handle) {
      handle = clearTimeout(handle)
    }
    
    handle = setTimeout(() => {
      fn(...arguments)
    }, delay)
  }
}

Debounce，继续中断超时，直到不再中断为止，然后触发fn。

function throttle(fn, delay) {
  let handle = null
  let prevArgs = undefined
  
  return function() {
    prevArgs = arguments
    if (!handle) {
      fn(...prevArgs)
      prevArgs = null
      handle = setInterval(() => {
        if (!prevArgs) {
          handle = clearInterval(handle)
        } else {
          fn(...prevArgs)
          prevArgs = null
        }
      }, delay)
    }
  }
}

Throttle，存储最后一个调用参数，并设置一个间隔来触发，直到没有过去的调用。

相似之处。它们都有延迟时间，并且在延迟期间不会发生火灾，特别是当只有一场火灾时。两者都不聚合过去的事件，因此事件的数量可能与实际的火灾不同。

的区别。在有重复事件的弹跳情况下，延迟可以延长。而在节流阀情况下的延迟是固定的。所以一般来说，油门产生的火焰比反弹产生的火焰要多。

很容易记住。将组捆绑为一个。节流保持捆绑调用在一定的频率。

更新1-20-23

Throttle可能不需要setInterval，这是我最近写的一个新版本，它也照顾到了这个问题。

function throttle(fn, delay) {
  let canFire = true
  let queue = []

  function pop() {
    if (queue.length < 1) return 

    const [that, args] = queue.pop()
    fn.apply(that, args)
    canFire = false
    setTimeout(() => {
      canFire = true
      pop()
    }, delay)
  }
  
  function push() {
    queue.push([this, arguments])
    if (canFire) pop()
  } 

  push.cancel = () => {
    queue = []
  }

  return push
}

差异

+--------------+-------------------+-------------------+
|              |  Throttle 1 sec   |  Debounce 1 sec   |
+--------------+-------------------+-------------------+
| Delay        | no delay          | 1 sec delay       |
|              |                   |                   |
| Emits new if | last was emitted  | there is no input |
|              | before 1 sec      |  in last 1 sec    |
+--------------+-------------------+-------------------+

用例解释:

搜索栏-不想搜索每次用户按下键?当用户停止输入1秒时想要搜索。使用debounce 1 SEC按下键。 射击游戏-手枪每次射击之间需要1秒的时间，但用户点击鼠标多次。在鼠标点击时使用油门。

角色互换:

Throttling 1 sec on search bar- If users types abcdefghij with every character in 0.6 sec. Then throttle will trigger at first a press. It will will ignore every press for next 1 sec i.e. bat .6 sec will be ignored. Then c at 1.2 sec will again trigger, which resets the time again. So d will be ignored and e will get triggered. Debouncing pistol for 1 sec- When user sees an enemy, he clicks mouse, but it will not shoot. He will click again several times in that sec but it will not shoot. He will see if it still has bullets, at that time (1 sec after last click) pistol will fire automatically.

进一步解释投入产出与现实生活的比较

酒吧外面有几个警卫。警卫允许说“我去”的人进入酒吧。这是正常的情况。任何说“我去”的人都可以进入酒吧。

现在有一个Throttle Guard(节流5秒)。他喜欢最先回应的人。谁先说“我要去”，他就让那个人去。然后他会在5秒内拒绝每个人。在这之后，无论谁先说，他都会被允许，其他人会被拒绝5秒。

还有另一个弹跳守卫(弹跳5秒)。他喜欢能让他精神休息5秒钟的人。所以如果有人说“我去”，警卫会等5秒钟。如果5秒钟内没有其他人打扰他，他会允许第一个人打扰他。如果有人在这5秒内说“我要去”，他会拒绝第一个。他又开始了等待第二个人的5秒，看第二个人是否能让他得到精神上的休息。

Throtle只是debounce的包装器，它使debounce在一段时间内调用传递的函数，如果debounce在一段时间内延迟函数调用，该时间大于Throtle中指定的时间。