Alain Barraud Mémento informatique  
 
Accueil Logithèque - SE Photo - vidéo Internet - protocoles Site Web PC - Réseau Archives
Page ouverte le 28/06/2009

JavaScript - L'objet "String"

Les chaînes de caractères, String en anglais, sont des objets très souvent utilisés.

Il y a de nombreuses méthodes à utiliser qui ont été classées en trois parties :
  • celles permettant de traiter des caractères séparément (pour récupérer la position d'un caractère dans une chaîne, ou inversement, y lire le caractère qui a une position donnée).
  • celles qui utilisent des chaînes de caractères entières (extraire une sous-chaîne, en concaténer plusieurs, etc.).
  • Enfin, des méthodes "rechercher / remplacer", qui utilisent les regex.
    Ce thème et ces méthodes feront l'objet du chapitre suivant.

Retour accueil JS


Sommaire

Sommaire

Opérations sur les caractères

  • length : longueur de la chaîne (nombre de caractères)
  • charAt(i) : retourne le iième caractère
  • indexOf(str) : retourne la position de str dans la chaîne (-1 si elle n'est pas trouvée)
  • lastIndexOf(str) : idem, mais renvoie la position de la dernière occurrence de str
  • toLowerCase() : retourne la chaîne en minuscules
  • toUpperCase() : retourne la chaîne en majuscules

Opérations sur les chaînes

  • concat(str) : retourne la chaîne concaténée avec str
  • split(str) : retourne, sous forme de tableau, les portions de la chaînes délimitées par str
  • substring(debut,fin) : extrait une sous-chaîne, depuis la position debut (incluse) à fin (excluse).
  • substr(debut,i) : extrait une sous-chaîne, depuis la position debut, en prenant i caractères

Chaînes et expressions régulières

Ces fonctions sont détaillées dans le chapitre consacré aux expressions régulières.
  • match(regex)
  • search(regex)
  • replace(regex, str)g>

Opérations sur les caractères

length, le retour

Description

Notre fameuse propriété length contient la longueur de la chaîne de caractère, autrement dit, le nombre de caractères dont cette cha&iicrc;ne est composée.

Exemple

Code : JavaScript
1     var chaine = "J'aime le JavaScript";
2     alert(chaine.length);
3     var longueur = "JavaScript".length;
4     alert(longueur);
Cet exemple affichera successivement 20 (nombre de caractères dans la phrase "J'aime le JavaScript", espaces compris) et 10 (il y a bien 10 lettres dans le mot "JavaScript").

charAt(i)

Description

La méthode charAt(i) renvoie le caractère qui se trouve à la position i de la chaîne.
alt Rappel, le premier caractère porte le numéro 0.
Le dernier a donc le numéro length-1 !

Exemple

Ceci affichera la lettre S :
Code : JavaScript
1     alert("JavaScript".charAt(4)); 2     alert(chaine.length);
3     var longueur = "JavaScript".length;
4     alert(longueur);

Voici une fonction qui sépare tous les caract`res par un espace.
Pour cela, on parcourt la chaîne, et on recopie chaque caractère en ajoutant un espace.
Le test affichera : "V i v e - l e - J a v a S c r i p t ".
Code : JavaScript
1     function separer(chaine)
2     {
3         var sortie = '';
4         for(var i=0; i<chaine.length; i++)
5             sortie += chaine.charAt(i) + ' ';
6         retourn sortie;
7     }
8     alert(separer('Vive-le-JavaScript'));

indexOf(str) et lastIndexOf(str)

Description

Ces deux méthodes sont assez utiles.
  • indexOf(str) renvoie la position de str dans la chaîne de caractères.
    Si str apparaît plusieurs fois, c'est la position de la première occurrence qui est renvoyée.
  • lastIndexOf(str)renvoie de même la position de str.
    La différence, c'est que si str apparaît plusieurs fois, c'est cette fois ci la position de la dernière occurrence qui est renvoyée.

alt Si ces méthodes ne trouvent pas str, elles retournent -1.
On peut donc les utiliser pour savoir si une chaîne de caractère contient une autre chaîne.

alt On peut préciser, en deuxième argument, la position à partir de laquelle doit commencer la recherche.
Par défaut, il s'agit de 0 pour indexOf (le premier caractère), et de length-1 pour lastIndexOf (le dernier caractère, car la recherche se fait en partant de la fin).

Exemple

On recherche "script" dans "JavaScript".
Ceci affichera Non, en raison de la majuscule !
Code : JavaScript
1     var chaine = "JavaScript";
2     if(chaine.indexOf("script") == -1)
3         alert("Non");
4     else
5         alert("Oui");

Exemple : vérifier la vraisemblance d'une adresse e-mail

On s'occupe ici de la présence d'un @ et d'un point

On récupère, grâce à nos deux fonctions, la position du premier @ et du dernier point.
La fonction doit renvoyer true quand le @ est après le premier caractère (le nº0), et quand le point est au moins deux caractères après le @.

L'adresse la plus courte qui est considérée comme correcte est donc : x@x.x
Code : JavaScript
1     function verifMail(email)
2     {
3         var position_at = email.indexOf('@');
4         var position_dot = email.lastIndexOf('.');
5         return (position_at > 0 && position_dot >= position_at + 2);
6     }
7
8     if(verilMail("mon.adresse@bon.net"))
9         alert("On dirait une adresse valide");
10     else
11         alert("L'adresse e-mail n'existe pas");

toLowerCase() et toUpperClass()

Description

JavaScript met à disposition deux méthodes permettant dans changer la casse d'une chaîne de caractères :
  • toLowerCase() : renvoie toute la chaîne en minuscules
  • toUpperCase() : renvoie toute la chaîne en majuscules
alt Ces méthodes sont très utiles dans le traitement des chaînes de caractères.
Elles permettent par exemple de comparer des chaînes sans tenir compte de la casse.

Exemple

Cet exemple affichera "salut tout le monde".
Code : JavaScript
1     var chaine = 'SaLut TouT LE mOnDe';
2     var chaineMin = chaine.toLowerCase();
3     alert(chaineMin);

Comparons maitenant deux chaînes : le message sera "Ces chaînes sont les mêmes, aux majuscules près".
Code : JavaScript
1     var chaine1 = "JavaScript";
2     var chaine2 = "javascript";
3     if(chaine1 == chaine2)
4         alert("Ces chaînes sont exactement les mêmes");
5     else if(chaine1.toLowerCase() == chaine2.toLowerCase())
6         alert("Ces chaînes les mêmes, aux majuscules près");
7     else
8         alert("Ces chaînes sont différentes");

Opérations sur les chaînes

concat(str), l'opérateur +

Description

L'opérateur + permet de concaténer deux chaînes : chaine+str est la chaîne constituée de chaine et de str mises bouts-à-bouts.
alt L'écriture précédente est strictement équivalente à chaine.concat(str)
Elle est bien plus lisible et intuitive, c'est pourquoi il est très rare d'utiliser concat.

Exemple

On affiche la chaîne "JavaScript", construite par concaténation (en utilisant les deux façons de faire).
Code : JavaScript
1     var chaine1 = 'Java';
2     var chaine2 = 'Script';
3     alert(chaine1 + chaine2);
4     alert(chaine1.concat(chaine2));

split(str)

Description

La méthode split(str) permet de découper une chaîne de caractères, en "coupant" aux endroit où la chaîne comporte str.
Les "morceaux" découpés sont renvoyés sous forme de tableau.

Cette méthode peut se révéler assez utile.
alt Cette méthode peut aussi s'utiliser avec une regex.
(abordé dans le chapitre suivant)

Exemple

Code : JavaScript
1     var chaine = 'www.siteduzero.com';
2     var tableau = chaine.split('.');

Ici, la chaîne chaine est découpée selon les points.
Il y aura donc trois parties :
  • tableau[0] qui contient www
  • tableau[1] qui contient siteduzero
  • tableau[2] qui contient com

substring(debut,fin)

Description

substring(debut,fin) renvoie la portion de chaîne délimitée par les positions debut (incluse) et fin (exclue).

Si fin n'est pas précisée, la portion est extraite de debut jusqu'à la fin de la chaîne.
alt La méthode nommée slice fait exactement la même chose que substring.

Exemple

Cet exemple affichera "Javascript".
Code : JavaScript
1     var chaine = 'Vive le Javascript !';
2     var sousChaine = chaine.substring(8, 18);
3     alert(sousChaine);

substr(debut,nombre)

Description

substr(debut, i) renvoie la portion de chaîne commençant à la position debut et contenant i caractères.
Si i n'est pas précisé, ou s'il y a moins de i caractères, la portion est extraite jusqu'à la fin de la chaîne.
alt Ne pas confondre substring et substr !

Exemple

Cet exemple affichera "Javascript".
Code : JavaScript
1     var chaine = 'Vive le Javascript !';
2     var sousChaine = chaine.substr(8, 10);
3     alert(sousChaine);

Rechercher et remplacer

alt Les méthodes présentées dans cette sous-partie utilisent les regex.
Cette notion (assez complexe) est présentée dans le chapitre suivant.

match(regex)

match(regex) applique l'expression régulière regex à la chaîne, et renvoie le résultat sous forme de tableau.

replace(regex, str)

replace(regex, str) remplace les sous-chaînes satisfaisant l'expression régulière regex par le motif de remplacement str.

search(regex)

search(regex) renvoie la position de la première sous-chaîne satisfaisant l'expression régulière regex.
Renvoie -1 s'il n'y a aucun résultat.
alt Pour rechercher une simple chaîne de caractère, cf. la méthode indexOf.

Dans le prochain chapitre, on reste dans le même sujet, mais en abordant les regex : c'est un outil vraiment puissant pour travailler sur les chaînes de caractères.
question Que pourra-t-on faire grâce aux regex ?
La vérification d'un numéro de téléphone ou d'une adresse e-mail (plus exactement, on vérifie s'il semble valide).
Ça permet également d'extraire des informations contenues dans une phrase écrite par l'utilisateur (en particulier, récupérer des chiffres, tel qu'un âge, dans une phrase comme "j'ai 99 ans").