Introduction : « Est-ce que ma chaîne est là ? » — l'éternelle question du développeur
Vous écrivez du code en TypeScript, et soudain la question se pose : « Comment vérifier si un tableau contient une chaîne spécifique ? » Cela semble anodin, mais le bon fonctionnement des filtres, la validation de formulaires, la recherche dans des listes et des centaines d'autres scénarios en dépendent. Cette question sur Stack Overflow a recueilli des milliers de vues — ce qui signifie qu'elle tourmente non seulement les débutants, mais aussi les développeurs expérimentés.
Aujourd'hui, nous allons passer en revue toutes les méthodes légitimes pour vérifier la présence d'une chaîne dans un tableau TypeScript. Mais nous ne nous contenterons pas d'énumérer les méthodes — nous examinerons les performances sous le capot, découvrirons quelle option est la plus rapide et quand utiliser des structures de données avancées. Vous apprendrez à écrire non seulement un code fonctionnel, mais un code rapide et élégant.
C'est parti ! 🚀
La méthode includes() : simplicité et lisibilité
La méthode la plus évidente et moderne est includes(). Elle est apparue avec ES2016 et est nativement prise en charge par TypeScript. Tout ce que vous avez à faire est de l'appeler sur le tableau et de passer la chaîne recherchée.
const fruits: string[] = ['pomme', 'banane', 'orange', 'kiwi'];const searchTerm: string = 'banane';
if (fruits.includes(searchTerm)) { console.log('Fruit trouvé ! 🍌');} else { console.log('Ce fruit n\'existe pas.');}Avantages :
- Code extrêmement lisible — on comprend immédiatement ce qui est fait.
- Retourne un
boolean— idéal pour les conditions. - Prend en charge le typage strict de TypeScript.
Inconvénients :
- Recherche linéaire O(n) — peut être lent pour les très grands tableaux (dizaines de milliers d'éléments).
- Ne fonctionne pas avec
NaN(mais c'est rare pour les chaînes).
Pour 90% des tâches, includes() est votre choix. Simple, fiable, rapide.
La méthode indexOf() : ancienne mais éprouvée
Avant l'arrivée de includes(), tout le monde utilisait indexOf(). Elle retourne également l'index de l'élément, mais si l'élément n'est pas trouvé, elle renvoie -1. La vérification de -1 est devenue un classique.
const languages: string[] = ['JavaScript', 'TypeScript', 'Python', 'Go'];const target: string = 'TypeScript';
if (languages.indexOf(target) !== -1) { console.log('Langage trouvé !');} else { console.log('Langage non listé.');}Avantages :
- Fonctionne dans tous les environnements, même les anciens navigateurs (si c'est important).
- Permet d'obtenir la position de l'élément pour des actions ultérieures.
Inconvénients :
- Moins lisible — il faut se souvenir de
-1. - Même complexité O(n).
- TypeScript peut se plaindre de la comparaison implicite ; il est préférable de spécifier explicitement le type.
Conseil : si vous n'avez pas besoin de l'index, utilisez includes(). Mais connaître indexOf() est utile — on le rencontre dans le code legacy.
La méthode find() : quand vous avez besoin de plus qu'un simple true/false
La méthode find() retourne le premier élément satisfaisant la condition, ou undefined si rien n'est trouvé. C'est un outil puissant lorsque vous recherchez non pas une simple chaîne, mais un objet avec un champ spécifique.
interface User { id: number; name: string;}
const users: User[] = [ { id: 1, name: 'Anne' }, { id: 2, name: 'Boris' }, { id: 3, name: 'Victor' }];
const foundUser = users.find(user => user.name === 'Boris');
if (foundUser) { console.log(`Utilisateur trouvé : ${foundUser.name}`);}Pour les simples tableaux de chaînes, find() est superflu, mais si vous avez besoin d'obtenir l'élément lui-même ou de vérifier une condition complexe, c'est le meilleur choix.
Performances : également O(n), mais légèrement plus lent que includes() en raison de l'appel du callback à chaque itération.
Optimisation avec Set : quand la vitesse est cruciale
Si vous vérifiez la présence de