L’objet global JavaScript String, propriétés et méthodes

L’objet String gère les chaînes de caractères. Le constructeur String() possède deux propriétés et une trentaine de méthodes.

Comme nous l’avons vu précédemment, nous n’utiliserons pas la fonction constructeur de cet objet pour créer de nouveaux objets de type string : on préfèrera en effet utiliser des valeurs primitives qui sont plus performantes et avec lesquelles on va également pouvoir utiliser les propriétés et méthodes définies dans le constructeur.

 

Les propriétés de l’objet String

Le constructeur String() ne possède que deux propriétés : une propriété length et, bien évidemment, une propriété prototype comme tout objet.

La propriété length va nous permettre d’obtenir la longueur d’une chaine de caractères. Cette longueur est exprimée en points de code (appelées « codets ») sur la base du format UTF-16.

La plupart des caractères comptent pour une unité ou un codet mais certains caractères spéciaux vont être représentés par deux codets. Attention donc : la propriété length ne renverra pas toujours une valeur égale au nombre de caractères présents dans la chaine.

Code HTML support pour présentation des propriétés de l'objet global String

Présentation de la propriété length de l'objet JavaScript String

Exemple d'utilisation de la propriété length de l'objet JavaScript String

See the Pen
Cours JavaScript 6.2.1
by Pierre (@pierregiraud)
on CodePen.

 

Les méthodes de l’objet String

Le constructeur String() dispose d’une trentaine de méthodes. Nous allons étudier celles qui me semblent les plus utiles ici.

La méthode includes()

La méthode includes() permet de déterminer si une chaine de caractères est inclue dans une autre. Cette méthode prend l’expression (la chaine) à rechercher en argument.

Si la chaine passée en argument est trouvée dans la chaine dans laquelle on effectue la recherche, includes() renvoie le booléen true. Dans le cas contraire, la méthode renvoie le booléen false.

Attention : cette méthode est sensible à la casse, ce qui signifie qu’une lettre majuscule et une lettre minuscule correspondent à deux entités différentes pour includes().

Code HTML support pour présentation des méthodes de l'objet global String

Présentation de la méthode includes de l'objet JavaScript String

Exemple d'utilisation de la méthode includes de l'objet JavaScript String

See the Pen
Cours JavaScript 6.2.2
by Pierre (@pierregiraud)
on CodePen.

Ici, on utilise la méthode includes() à partir de notre variable let prez. Cette variable stocke en effet une valeur primitive de type chaine de caractères (ou « string » en anglais) et, comme on l’a dit précédemment, on va pouvoir utiliser les propriétés et méthodes de String à partir de variables stockant des valeurs primitives de ce type.

Dans le cas présent, on commence par tester la présence de la chaine de caractères « Pierre » dans la chaine stockée dans let prez. Si « Pierre » est trouvé dans la chaine, alors includes() renvoie le booléen true. Dans notre exemple, la valeur de retour de includes() est utilisée comme test d’une condition if.

Le code de nos conditions if utilise des éléments qu’on n’a pas encore vu et qu’on étudiera dans la suite de ce cours. Ici, il sert à placer une phrase dans un élément p à l’id défini.

Les méthodes startsWith() et endsWith()

La méthode startsWith() permet de déterminer si une chaine commence par une certaine sous chaine (ou expression). Si c’est le cas, cette méthode renvoie true. Dans le cas contraire, c’est le booléen false qui est renvoyé.

La méthode endsWith() permet de déterminer si une chaine se termine par une certaine sous chaine. Elle va fonctionner exactement de la même manière que startsWith().

Présentation des méthodes startswith et endswith de l'objet JavaScript String

Exemple d'utilisation des méthodes startswith et endswith de l'objet JavaScript String

See the Pen
Cours JavaScript 6.2.3
by Pierre (@pierregiraud)
on CodePen.

La méthode substring()

La méthode substring() retourne une sous-chaîne de la chaîne courante à partir d’un indice de départ.

Cette méthode demande un indice de départ en argument obligatoire qui va servir à indiquer la position de départ de la sous-chaine. On va également pouvoir passer un deuxième indice facultatif pour préciser une position de fin pour notre sous-chaine.

Notez que dans le cas où on fournit une position de départ qui se situe après la position de fin, la méthode substring() intervertira automatiquement les deux valeurs.

Présentation de la méthode substring de l'objet JavaScript String

Exemple d'utilisation de la méthode substring de l'objet JavaScript String

See the Pen
Cours JavaScript 6.2.4
by Pierre (@pierregiraud)
on CodePen.

Les méthodes indexOf() et lastIndexOf()

La méthode indexOf() permet de déterminer la position de la première occurrence d’un caractères ou d’une chaine de caractères dans une chaîne de caractères de base.

Cette méthode va prendre l’expression à rechercher dans la chaine de caractères en argument et va renvoyer la position à laquelle cette expression a été trouvée la première fois dans la chaine si elle est trouvée ou la valeur -1 si l’expression n’a pas été trouvée dans la chaine.

On va également pouvoir passer un deuxième argument optionnel à indexOf() qui correspond à l’endroit où on souhaite faire démarrer la recherche dans la chaine. Par défaut, la recherche se fait dans toute la chaine.

Attention : la méthode indexOf() est sensible à la casse, ce qui signifie qu’une lettre majuscule et une lettre minuscule correspondent à deux entités différentes pour elle.

La méthode lastIndexOf() va fonctionner exactement de la même manière que sa sœur indexOf() à la différence près que c’est la position de la dernière occurrence de l’expression cherchée qui va être renvoyée (ou -1 si l’expression n’est pas trouvée dans la chaine).

Présentation des méthodes indexof et lastindexof de l'objet JavaScript String

Exemple d'utilisation des méthodes indexof et lastindexof de l'objet JavaScript String

See the Pen
Cours JavaScript 6.2.5
by Pierre (@pierregiraud)
on CodePen.

La méthode slice()

La méthode slice() extrait une section d’une chaine de caractères et la retourne comme une nouvelle chaine de caractères. La chaîne de caractères de départ n’est pas modifiée.

On doit fournir en argument de départ obligatoire la position de départ dans la chaine de caractères de départ où doit démarrer l’extraction. On peut également passer en deuxième argument optionnel la positon où l’extraction doit s’arrêter.

Cette méthode va donc fonctionner comme substring() à deux différences près :

  • En passant des valeurs négatives en argument à slice(), les positions de départ et de fin d’extraction seront calculées à partir de la fin de la chaine de caractères à partir de laquelle on extrait ;
  • En passant une position de départ plus lointaine que la position d’arrivée à slice(), cette méthode n’inverse pas les valeurs mais renvoie une chaine de caractères vide.

Vous pouvez également noter que la méthode slice() ne modifie pas la chaine de caractères d’origine mais renvoie une nouvelle chaine.

Présentation de la méthode slice de l'objet JavaScript String

Exemple d'utilisation de la méthode slice de l'objet JavaScript String

See the Pen
Cours JavaScript 6.2.6
by Pierre (@pierregiraud)
on CodePen.

La méthode replace()

La méthode replace() nous permet de rechercher une expression dans une chaine de caractères et de la remplacer par une autre.

On va passer deux arguments à cette méthode : l’expression à rechercher, et l’expression de remplacement.

La méthode replace() va renvoyer une nouvelle chaine de caractères avec les remplacements faits. La chaine de caractères de départ ne sera pas modifiée.

Notez que dans le cas où on passe une expression de type chaine de caractères à rechercher, seule la première occurrence dans la chaine sera remplacée. Pour pouvoir remplacer toutes les occurrences, il faudra passer une expression régulière comme schéma de recherche à cette méthode. Nous étudierons les expressions régulières dans une prochaine partie.

Présentation de la méthode replace de l'objet JavaScript String

Exemple d'utilisation de la méthode replace de l'objet JavaScript String

See the Pen
Cours JavaScript 6.2.7
by Pierre (@pierregiraud)
on CodePen.

Les méthodes toLowerCase() et toUpperCase()

La méthode toLowerCase() retourne une chaine de caractères en minuscules.

A l’inverse, la méthode toUpperCase() retourne une chaine de caractères en majuscules.

Ces deux méthodes retournent une nouvelle chaine de caractères et ne modifient pas chaine de caractères de base.

Présentation des méthodes tolowercase et touppercase de l'objet JavaScript String

Exemple d'utilisation des méthodes tolowercase et touppercase de l'objet JavaScript String

See the Pen
Cours JavaScript 6.2.8
by Pierre (@pierregiraud)
on CodePen.

La méthode trim()

La méthode trim() supprime les espaces ou les « blancs » en début et en fin de chaîne. Cette méthode va s’avérer très pratique lorsqu’on voudra nettoyer des données pour ensuite effectuer des opérations dessus.

Cette méthode renvoie une nouvelle chaine de caractères sans blancs ni au début ni à la fin. Elle ne modifie pas la chaine de caractères de départ.

Présentation de la méthode trim de l'objet JavaScript String

Exemple d'utilisation de la méthode trim de l'objet JavaScript String

See the Pen
Cours JavaScript 6.2.9
by Pierre (@pierregiraud)
on CodePen.

Note : On inspecte ici le code de la page depuis la console du navigateur afin de bien voir que trim() a supprimé les espaces au sein des éléments p car ces espaces sont dans tous les cas retirés à l’affichage dans le navigateur.

Autres méthodes de l’objet String

Il existe d’autres méthodes de String qui peuvent être intéressantes mais qui nécessitent de connaitre d’autres éléments du JavaScript pour être utilisées de manière pertinente.

Parmi celles-ci, on peut notamment cite les méthodes match, matchAll() et search() qui vont trouver tout leur intérêt lorsqu’elles vont être utilisées avec des expressions régulières ou encore la méthode split() qui nécessite de connaitre les tableaux pour être utilisée correctement.

Laisser un commentaire

© Pierre Giraud - Toute reproduction interdite - Mentions légales