9

スロットル機能とデバウンス機能の概念が少しわかりません。

私が得るように：

特定のイベントが発生した後に呼び出す必要がある関数をデバウンスします。ドラッグ、キーアップなどのイベントで使用されます。イベントが発生するたびに発生するのではなく、一連のイベントが完了したときに発生することを目的としています。通常、単語全体が入力された後、またはドラッグまたはサイズ変更シーケンスが終了した後。

一連のイベントが発生している間に起動する必要がある関数を抑制しますが、呼び出される回数を制御したい場合。ドラッグの動きのように、イベントが発生するたびにではなく、x ピクセルの距離ごと、または 100 ミリ秒ごとに関数を呼び出す必要があります。そのため、一連のイベントが発生している間にスロットル関数が呼び出されますが、その回数は少なくなります。

質問：

これは、これらの機能とその目的の正しい認識ですか? それらを区別する他の機能はありますか？

4

3 に答える 3

3

略して：

スロットルは、一定の呼び出し中に特定の間隔で関数を呼び出すように設計されています。のように: window.scroll。 デバウンスは、特定の時間内に関数を 1 回だけ呼び出すように設計されています。何度呼んでも構いません。Like: 送信ボタンのクリック。次に例を示します。

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

違いがわかります。

于 2015-06-04T10:27:36.850 に答える
1

私の TL が今日指摘したように、lodash でのこの 2 つの関数の一般的な実装について言及する価値があります。

スロットル機能は、実際にはデバウンスの特定の構成にすぎません。

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
  })
}
于 2018-08-31T14:56:02.760 に答える