Maison > interface Web > js tutoriel > le corps du texte

**Pourquoi la fonction de limitation JavaScript simple élimine-t-elle l'exécution finale après la période de limitation ?**

DDD
Libérer: 2024-10-27 00:41:30
original
482 Les gens l'ont consulté

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

Limitation simple en JavaScript

JavaScript fournit divers outils pour les fonctions de limitation, notamment lodash et le trait de soulignement. Cependant, dans les cas où ces bibliothèques peuvent être excessives, une implémentation de limitation personnalisée est souhaitable.

Fonction de limitation existante et défis

La fonction de limitation fournie est fonctionnelle, mais elle présente un problème. Une fois la période d'accélération expirée, il exécute la fonction une dernière fois. Cela peut entraîner un comportement indésirable dans des scénarios dans lesquels la fonction ne doit pas se déclencher plusieurs fois.

Fonction d'accélérateur améliorée

Pour résoudre ce problème, considérez la fonction d'accélérateur améliorée suivante qui élimine l'exécution finale après la période d'accélération :

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;
  };
};
Copier après la connexion

Cette fonction mise à jour fournit un mécanisme d'accélération configurable avec des paramètres facultatifs pour le déclenchement des fronts montant et descendant.

Fonction d'accélération simplifiée

Si la personnalisation n'est pas requise, une fonction de limitation plus simple est la suivante :

function throttle (callback, limit) {
    var waiting = false; 
    return function () { 
        if (!waiting) { 
            callback.apply(this, arguments); 
            waiting = true; 
            setTimeout(function () { 
                waiting = false; 
            }, limit);
        }
    }
}
Copier après la connexion

Cette fonction non configurable limite la fonction cible à un intervalle de temps spécifié sans avoir besoin d'options complexes. .

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!