**シンプルな JavaScript スロットル関数により、スロットル期間後の最終実行が削除されるのはなぜですか?**

DDD
リリース: 2024-10-27 00:41:30
オリジナル
482 人が閲覧しました

**Why does the Simple JavaScript Throttle Function Eliminate the Final Execution After the Throttle Period?**

JavaScript での単純なスロットル

JavaScript には、lodash や underscore など、関数をスロットルするためのさまざまなツールが用意されています。ただし、これらのライブラリが過剰になる可能性がある場合には、カスタム スロットルの実装が望ましいです。

既存のスロットル関数と課題

提供されたスロットル関数は機能しますが、問題を提示します。スロットル期間が終了すると、最後にもう一度関数が実行されます。これにより、関数を複数回起動すべきではないシナリオで望ましくない動作が発生する可能性があります。

改善されたスロットル関数

この問題に対処するには、次の拡張されたスロットル関数を検討してください。スロットル期間後の最終実行を排除します:

function throttle(func, wait, options) {
  var context, args, result;
  var timeout = null;
  var previous = 0;
  if (!options) options = {};
  var later = function() {
    previous = options.leading === false ? 0 : Date.now();
    timeout = null;
    result = func.apply(context, args);
    if (!timeout) context = args = null;
  };
  return function() {
    var now = Date.now();
    if (!previous && options.leading === false) previous = now;
    var remaining = wait - (now - previous);
    context = this;
    args = arguments;
    if (remaining <= 0 || remaining > wait) {
      if (timeout) {
        clearTimeout(timeout);
        timeout = null;
      }
      previous = now;
      result = func.apply(context, args);
      if (!timeout) context = args = null;
    } else if (!timeout &amp;&amp; options.trailing !== false) {
      timeout = setTimeout(later, remaining);
    }
    return result;
  };
};
ログイン後にコピー

この更新された関数は、前縁および後縁トリガー用のオプションのパラメーターを備えた構成可能なスロットル メカニズムを提供します。

簡素化されたスロットル関数

カスタマイズ性が必要ない場合、より単純なスロットル関数は次のとおりです。

function throttle (callback, limit) {
    var waiting = false; 
    return function () { 
        if (!waiting) { 
            callback.apply(this, arguments); 
            waiting = true; 
            setTimeout(function () { 
                waiting = false; 
            }, limit);
        }
    }
}
ログイン後にコピー

この構成不可能な関数は、複雑なオプションを必要とせずに、ターゲット関数を指定された時間間隔にスロットルします。 .

以上が**シンプルな JavaScript スロットル関数により、スロットル期間後の最終実行が削除されるのはなぜですか?**の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!