Exemples de sous-chaînes JavaScript - Méthodes Slice, Substr et Substring dans JS

Dans la programmation quotidienne, nous avons souvent besoin de travailler avec des chaînes. Heureusement, il existe de nombreuses méthodes intégrées dans JavaScript qui nous aident à travailler avec des tableaux, des chaînes et d'autres types de données. Nous pouvons utiliser ces méthodes pour diverses opérations telles que la recherche, le remplacement, la concaténation de chaînes, etc.

Obtenir une sous-chaîne à partir d'une chaîne est l'une des opérations les plus courantes en JavaScript. Dans cet article, vous allez apprendre à obtenir une sous-chaîne à l'aide de 3 méthodes intégrées différentes. Mais d'abord, laissez-moi vous expliquer brièvement ce qu'est une sous-chaîne.

Qu'est-ce qu'une sous-chaîne?

Une sous-chaîne est un sous-ensemble d'une autre chaîne:

"I am learning JavaScript and it is cool!" --> Original String "I am learning JavaScript" --> Substring "JavaScript is cool!" --> Another Substring

Comme dans l'exemple ci-dessus, dans certains cas, nous devons obtenir une ou plusieurs sous-chaînes d'une phrase complète ou d'un paragraphe. Voyons maintenant comment faire cela en JavaScript de 3 manières différentes.

Vous pouvez également regarder la version vidéo des exemples d'utilisation ici:

1. La méthode substring ()

Commençons par la méthode substring (). Cette méthode obtient essentiellement une partie de la chaîne d'origine et la renvoie comme une nouvelle chaîne. La méthode substring attend deux paramètres:

string.substring(startIndex, endIndex);
  • startIndex : représente le point de départ de la sous-chaîne
  • endIndex : représente le point de fin de la sous-chaîne (facultatif)

Voyons l'utilisation dans un exemple. Supposons que nous ayons l'exemple de chaîne ci-dessous:

const myString = "I am learning JavaScript and it is cool!";

Maintenant, si nous définissons startIndex sur 0 et endIndex sur 10, nous obtiendrons les 10 premiers caractères de la chaîne d'origine:

Cependant, si nous définissons uniquement un index de départ et aucun index de fin pour cet exemple:

Ensuite, nous obtenons une sous-chaîne à partir du 6ème caractère jusqu'à la fin de la chaîne d'origine.

Quelques points supplémentaires:

  • Si startIndex = endIndex, la méthode substring renvoie une chaîne vide
  • Si startIndex et endIndex sont tous les deux supérieurs à la longueur de la chaîne, il renvoie une chaîne vide
  • Si startIndex> endIndex, la méthode substring échange les arguments et retourne une sous-chaîne, en supposant que endIndex> startIndex

2. La méthode slice ()

La méthode slice () est similaire à la méthode substring () et elle renvoie également une sous-chaîne de la chaîne d'origine. La méthode slice attend également les deux mêmes paramètres:

string.slice(startIndex, endIndex);
  • startIndex : représente le point de départ de la sous-chaîne
  • endIndex : représente le point de fin de la sous-chaîne (facultatif)

Les points communs des méthodes substring () et slice ():

  • Si nous ne définissons pas d'index de fin, nous obtenons une sous-chaîne à partir du numéro d'index donné jusqu'à la fin de la chaîne d'origine:
  • Si nous définissons à la fois le startIndex et le endIndex, nous obtiendrons les caractères entre les numéros d'index donnés de la chaîne d'origine:
  • Si startIndex et endIndex sont supérieurs à la longueur de la chaîne, il renvoie une chaîne vide

Différences de la méthode slice ():

  • Si startIndex> endIndex, la méthode slice () renvoie une chaîne vide
  • Si startIndex est un nombre négatif, alors le premier caractère commence à la fin de la chaîne (inverse):
Remarque: nous pouvons également utiliser la méthode slice () pour les tableaux JavaScript. Vous pouvez trouver ici mon autre article sur la méthode slice pour voir l'utilisation des tableaux.

3. La méthode substr ()

Selon les documents de Mozilla, la méthode substr () est considérée comme une fonction héritée et son utilisation doit être évitée. Mais je vais tout de même expliquer brièvement ce qu'il fait car vous pourriez le voir dans des projets plus anciens.

La méthode substr () renvoie également une sous-chaîne de la chaîne d'origine et attend deux paramètres comme:

string.substring(startIndex, length);
  • startIndex : représente le point de départ de la sous-chaîne
  • longueur : nombre de caractères à inclure (facultatif)

Vous pouvez voir la différence ici: la méthode substr () attend le deuxième paramètre comme une longueur au lieu d'un endIndex:

Dans cet exemple, il compte essentiellement 5 caractères commençant par le startIndex donné et les renvoie sous forme de sous-chaîne.

Cependant, si nous ne définissons pas le deuxième paramètre, il retourne jusqu'à la fin de la chaîne d'origine (comme le font les deux méthodes précédentes):

Remarque: les 3 méthodes renvoient la sous-chaîne sous forme de nouvelle chaîne et ne modifient pas la chaîne d'origine.

Emballer

Voici donc les 3 méthodes différentes pour obtenir une sous-chaîne en JavaScript. Il existe de nombreuses autres méthodes intégrées dans JS qui nous aident vraiment beaucoup lorsque nous traitons diverses choses en programmation. Si vous trouvez cet article utile, partagez-le sur les réseaux sociaux.

Si vous souhaitez en savoir plus sur le développement web, n'hésitez pas à me suivre sur Youtube !

Merci pour la lecture!