Pourquoi Set.has() est plus rapide que Array.includes() pour rechercher des éléments

Parfois, lors de la création d'applications, les performances finissent par être la clé ou du moins un facteur important, en particulier lorsqu'il s'agit de grands ensembles de données ou d'exigences en temps réel. L'une des tâches les plus courantes en JavaScript consiste à vérifier si une valeur existe dans une collection. Les deux alternatives les plus souvent utilisées sont Array.includes() et Set.has(). Les deux fonctionnent, mais en réalité, Set.has() fonctionne mieux que Array.includes. Examinons les raisons de cela et décidons quand vous devez utiliser l'une ou l'autre alternative.

Comprendre Array.includes() et Set.has()

Il existe deux méthodes qui semblent assez simples dans leur utilisation, mais qui ont des implémentations différentes, à savoir Array.includes() et Set.has().

Array.includes()

La méthode include() vérifie si une valeur donnée est présente dans un tableau.
Il utilise la complexité temporelle de O(n), de telle sorte que plus la longueur du tableau est grande, plus la vérification de la valeur prendra du temps.
En effet, Array.includes() recherche le tableau du début à la fin (ou jusqu'à ce qu'il trouve la valeur), et plus le tableau est grand, plus cela prend de temps.

Set.has()

La méthode has() d'un Set vérifie également si une valeur donnée existe, mais le fait beaucoup plus rapidement.
Set.has() s'appuie sur une structure basée sur une table de hachage qui permet une recherche en temps constant, ou une complexité temporelle O(1).
Contrairement aux tableaux, set est conçu pour gérer des valeurs uniques, il ne contiendra donc pas de valeurs en double et aura plus de temps de recherche.

Pourquoi Set.has() est plus rapide pour les grands ensembles de données

Lorsque vous utilisez Set.has(), JavaScript peut trouver l'élément en une seule opération directe, quel que soit le nombre d'éléments dans l'ensemble. Par exemple, lors de la vérification si une valeur se trouve dans un ensemble contenant un million, le temps consommé par Set.has() sera exactement le même que pour en vérifier dix.

D'un autre côté, Array.includes() examine chaque élément de gauche à droite séquentiellement jusqu'à ce qu'il trouve l'élément qui l'intéresse ou atteigne sa toute fin. Cela signifie que plus la taille est longue, plus le temps de contrôle est long, surtout dans le cas d'un article proche de la fin - et surtout lorsque l'article en question n'est pas là.

Voici un exemple détaillé :

const bigArray = Array.from({ length: 1000000 }, (_, i) => i);
const bigSet = new Set(bigArray);

const valueToFind = 999999;

// Array.includes (O(n)) - Slower for large arrays
console.time("Array.includes");
bigArray.includes(valueToFind);
console.timeEnd("Array.includes");

// Set.has (O(1)) - Faster for large sets
console.time("Set.has");
bigSet.has(valueToFind);
console.timeEnd("Set.has");

Lorsque vous exécutez ceci, vous voyez que Set.has() surpasse de loin Array.includes() sur les grands tableaux. En pratique, cette différence pourrait bien se traduire par des animations plus fluides, des temps de chargement plus rapides ou même une utilisation moindre des ressources sur votre serveur.

Quand utiliser Set.has() et Array.includes()

Tout dépend de ce que vous essayez d’atteindre. Voici un bref résumé :

Utilisez Set.has() si :

• Vous traitez du Big Data et effectuez de nombreuses recherches.
• Vous travaillez avec des valeurs uniques, telles qu'un ensemble d'ID utilisateur, de balises ou de mots-clés uniques.
• Le petit coût initial d'une conversion de tableau en un
ne vous dérange pas
• défini pour minimiser le nombre de recherches ultérieures.

Utilisez Array.includes() si :

• Votre ensemble de données est petit et la différence de performances est négligeable.
• Vous ne devez rechercher un élément qu'une ou plusieurs fois, il n'y a donc aucun avantage à créer un ensemble.
• Vous avez affaire à des doublons, qu'un ensemble ne peut pas gérer.

Exemple de cas d'utilisation

Imaginez que vous implémentez une fonctionnalité de recherche d'utilisateurs qui filtre les noms par rapport à une liste de mots bloqués. Si vous avez des centaines de mots bloqués et effectuez des recherches fréquentes, l'utilisation d'un ensemble pour les mots bloqués peut accélérer chaque vérification de recherche :

const bigArray = Array.from({ length: 1000000 }, (_, i) => i);
const bigSet = new Set(bigArray);

const valueToFind = 999999;

// Array.includes (O(n)) - Slower for large arrays
console.time("Array.includes");
bigArray.includes(valueToFind);
console.timeEnd("Array.includes");

// Set.has (O(1)) - Faster for large sets
console.time("Set.has");
bigSet.has(valueToFind);
console.timeEnd("Set.has");

Même dans des cas plus petits, un Set aidera à garder les choses efficaces et prévisibles. De plus, si la liste des mots bloqués s’allonge, vous disposerez déjà d’une solution évolutive.

Points clés à retenir

• Performance : Set.has() offre une complexité temporelle O(1), ce qui le rend beaucoup plus rapide que Array.includes() avec O(n) pour les collections plus grandes

• Adéquation : l'ensemble est conçu pour des valeurs uniques, il est donc naturellement optimisé pour les recherches. Les tableaux sont plus flexibles avec les valeurs en double, mais sont plus lents à vérifier leur existence.

• Évolutivité : à mesure que vos données augmentent, Set.has() continue de bien fonctionner, tandis que Array.includes() ralentira.

Pensées finales

Il est toujours important de connaître la taille et la nature de votre ensemble de données lorsque vous choisissez entre Set.has() et Array.includes(). Array.includes() convient parfaitement aux petits ensembles de données, mais Set.has() est un outil précieux dans les situations où la vitesse est critique. La bonne structure de données peut vous aider à optimiser vos applications JavaScript pour qu'elles soient plus rapides et plus efficaces sans apporter de modifications majeures à votre code.

Par conséquent, chaque fois que vous vérifiez si quelque chose est là, vous devez vous demander : est-ce un travail pour un tableau, ou suis-je capable d'utiliser la puissance d'un ensemble ? Bien faire les choses pourrait bien être la différence dont votre application a besoin.

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!