Функции дроссельной заслонки и отказов

Question

Я немного сомневаюсь в понятиях функций газа и деблокирования.

Как я понял:

мы отказываемся от функции, которая должна вызываться после определенного события. Он используется в таких событиях, как перетаскивание, нажатие клавиш и т. Д., Чтобы не запускать все время, когда событие запускается, а вместо этого, когда серия событий завершена. Обычно после того, как было введено целое слово, или последовательность перетаскивания или изменения размера закончилась.

мы ограничиваем функцию, которая должна срабатывать во время серии событий, но когда мы хотим контролировать количество вызовов, которые она вызывается. Как и в случае перетаскивания, мы хотим, чтобы функция вызывалась только через каждые x пикселей расстояния или только через каждые 100 мс, а не каждый раз, когда происходит событие. Таким образом, функция дросселя вызывается, когда происходит серия событий, просто реже.

Вопрос:

это правильное восприятие этих функций и их назначение? Есть ли другие особенности, которые их отличают?

Answer 1

Да, это хороший обзор различий.

Однако вы можете подчеркнуть, что эти методы на самом деле не изменяют вызываемые ими функции. Они просто создают новую функцию (с идентификатором, к которому привязано поведение, ограничивающее скорость), которую можно вызывать так часто, как это необходимо, и внутренне пересылают вызовы в деблокированную или ограниченную функцию.

Answer 2

Коротко:

дроссель предназначен для вызова функции в определенный интервал во время постоянного вызова. Нравится: window.scroll. Функцияdebounce предназначена для вызова функции только один раз в течение определенного времени. не важно сколько раз он звонил. Нравится: нажмите кнопку "Отправить". Вот пример:

//http://jsfiddle.net/1dr00xbn/

Вы можете увидеть разницу.

Answer 3

Как указал мой TL сегодня, стоит упомянуть, что в популярной реализации этих 2 функций в lodash:

• https://github.com/lodash/lodash/blob/master/debounce.js
• https://github.com/lodash/lodash/blob/master/throttle.js

Функция Throttle на самом деле является просто определенной конфигурацией debounce:

function throttle(func, wait, options) {
  let leading = true
  let trailing = true

  if (typeof func != 'function') {
    throw new TypeError('Expected a function')
  }
  if (isObject(options)) {
    leading = 'leading' in options ? !!options.leading : leading
    trailing = 'trailing' in options ? !!options.trailing : trailing
  }
  return debounce(func, wait, {
    'leading': leading,
    'maxWait': wait,
    'trailing': trailing
  })
}