Vérification de sous-chaîne en JavaScript : 3 méthodes pour débutants

Formateur Python en ligne pour débutants

Apprenez Python facilement sans surcharge théorique. Résolvez des tâches pratiques avec vérification automatique et écrivez du code directement dans le navigateur.

Start Course

« Cette chaîne contient-elle ce mot ? » — la question qui tourmente chaque débutant

Vous écrivez un script, recevez une réponse du serveur ou filtrez simplement une liste de villes. Et soudain, vous êtes bloqué : comment vérifier si une chaîne contient une sous-chaîne spécifique en JavaScript ? Cette question est un véritable hit sur Stack Overflow, des milliers de développeurs la posent. Et ce n’est pas pour rien : les chaînes sont la base de toute application, et savoir y rechercher rapidement des sous-chaînes est une compétence fondamentale.

Dans ce tutoriel, nous allons aborder trois méthodes fonctionnelles : de la plus moderne (et préférée de tous) à la classique avec des bonus. Vous apprendrez quand utiliser chaque méthode et saurez écrire un code dont vous n’aurez pas honte lors d’un entretien.

\n\n

Méthode n°1 : `includes()` — simplicité et élégance

Si vous écrivez du code en JavaScript moderne (ES6 et supérieur), alors includes() est votre meilleur ami. Cette méthode retourne true ou false et se lit comme une question anglaise courante : « La chaîne inclut-elle la sous-chaîne ? ».

\n\n

Syntaxe

string.includes(searchString, position)

searchString — ce que nous recherchons (obligatoire).
position — paramètre optionnel, à partir de quel index commencer la recherche (par défaut 0).

\n\n

Exemple en action

const message = "Bonjour le monde ! JavaScript est génial.";\n\nconsole.log(message.includes("JavaScript")); // true\nconsole.log(message.includes("Python"));     // false\nconsole.log(message.includes("monde", 10));    // false (recherche à partir du 10e caractère)\n

Notez que la méthode est sensible à la casse. "javascript" et "JavaScript" sont des chaînes différentes. Si vous devez ignorer la casse, convertissez simplement les deux chaînes en minuscules :

const text = "Nous apprenons JavaScript";\nconst keyword = "javascript";\n\nconsole.log(text.toLowerCase().includes(keyword.toLowerCase())); // true\n

\n\n

Quand l’utiliser

Validation de formulaires (vérification de la présence de "@" dans un email).
Recherche dans une liste (filtrage de produits).
Toute vérification simple d’inclusion.

\n\n

Méthode n°2 : `indexOf()` — le classique qui ne meurt jamais

Avant l’arrivée de includes(), tout le monde utilisait indexOf(). Il ne se contente pas de dire « oui/non », mais retourne l’index de la première occurrence de la sous-chaîne. Si la sous-chaîne n’est pas trouvée, il retourne -1.

\n\n

Syntaxe

string.indexOf(searchValue, fromIndex)

\n\n

Exemple

const sentence = "J’aime JavaScript et Python.";\n\nconsole.log(sentence.indexOf("aime")); // 2\nconsole.log(sentence.indexOf("Ruby"));  // -1\n\n// Vérification d’inclusion\nif (sentence.indexOf("JavaScript") !== -1) {\n    console.log("Oui, la chaîne contient JavaScript !");\n}\n

\n\n

Point subtil : pourquoi pas `!== -1` ?

Beaucoup de débutants écrivent if (str.indexOf("word")) — et c’est une erreur. Si la sous-chaîne se trouve au tout début (index 0), la condition if (0) est considérée comme false. Comparez toujours avec -1.

\n\n

Quand utiliser `indexOf()` plutôt que `includes()`

Quand vous avez besoin de l’index de début de la sous-chaîne (par exemple, pour extraire une partie de la chaîne).
Travailler avec du code ancien (IE et anciennes versions de navigateurs).
Quand vous devez trouver toutes les occurrences (dans une boucle en modifiant fromIndex).

\n\n

Méthode n°3 : `search()` et RegExp — quand la flexibilité est nécessaire

Et si vous devez trouver non pas un simple mot, mais un motif ? Par exemple, « tous les mots commençant par "JS" » ou « un numéro de téléphone au format +7-xxx-xxx-xx-xx ». C’est là que les expressions régulières et la méthode search() viennent à la rescousse.

\n\n