Aller au menu - Aller au contenu

Icône L'objet "String"

Par Avatar JoSé2
Mise à jour : 22/07/2009
5 116 visites depuis 7 jours, dont 98 sur ce chapitre classé 38/786
Les chaînes de caractères, nommées String en anglais, sont elles-aussi des objets, qui sont de plus très souvent utilisés.
Découvrons sans plus tarder les nombreuses méthodes à utiliser, pour pouvoir en faire ce qu'on veut :) .

Nous les avons classé en trois parties.
  • Tout d'abord, 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).
  • Puis 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 en haut
Sommaire du chapitre :
Icône du chapitre
Chapitre précédent Sommaire Chapitre suivant
Retour en haut

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)
Retour en haut

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îne est composée.


Exemple



Code : JavaScript
1
2
3
4
var chaine = "J'aime le JavaScript";
alert(chaine.length);
var longueur = "JavaScript".length;
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.

Pour 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));


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
2
3
4
5
6
7
8
function separer(chaine)
{
     var sortie = '';
     for(var i=0; i<chaine.length; i++) 
          sortie += chaine.charAt(i) + ' ';
     return sortie;
}
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.


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.


On peut préciser, en deuxième argument, la position a 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
2
3
4
5
var chaine = "JavaScript";
if(chaine.indexOf("script") == -1)
     alert("Non");
else
     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 fonction, 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
 2
 3
 4
 5
 6
 7
 8
 9
10
11
function verifMail(email)
{
     var position_at = email.indexOf('@');
     var position_dot = email.lastIndexOf('.');
     return (position_at > 0 && position_dot >= position_at + 2);
}
 
if(verifMail("mon.adresse@bon.net"))
     alert("On dirait une adresse valide");
else
     alert("L'adresse e-mail n'existe pas");



toLowerCase() et toUpperCase()




Description



JavaScript met à disposition deux méthodes permettant d'en 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


Ces méthodes sont très utiles dans le traitement des chaînes de caractères.
Elle 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
2
3
var chaine = 'SaLut TouT LE mOnDe';
var chaineMin = chaine.toLowerCase();
alert(chaineMin);


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

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.

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
2
3
4
var chaine1 = 'Java';
var chaine2 = 'Script';
alert(chaine1 + chaine2);
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.

Cette méthode peut aussi s'utiliser avec une regex.
(abordé dans le chapitre suivant)



Exemple



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


Ici, la chaîne chaine est découpés 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.

La méthode nommée slice fait exactement la même chose que substring.



Exemple



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



substr(debut,nombre)




Description



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

Ne confondez pas substring et substr !



Exemple



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

Rechercher et remplacer

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.

Pour rechercher une simple chaîne de caractère, cf. la méthode indexOf.
Retour en haut
Dans le prochain chapitre, nous restons 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.

Qu'est-ce qu'on apprendra à faire grâce à ces fameuses regex ?

On peut d'ores et déjà citer 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 qu'a écrit l'utilisateur (en particulier, récupérer des chiffres, tel qu'un âge, dans une phrase comme "j'ai 99 ans").

Et vous verrez, les regex sont extrêmement pratique dans ce genre de situations.
Chapitre précédent Sommaire Chapitre suivant
Retour en haut

Partager

Retour en haut
3 commentaires pour "L'objet "String""
Note moyenne : 3.51 / 4 (260 votes)
Pseudo Commentaire
Hors ligne wboss # Posté le 03/12/2008 à 17:14:42

Ville : Bondy
Pays : France métropolitaine

 Bonjour,

Une faute d'inattention s'est produite dans ce chapitre.

Le titre ne devrait pas être toLowerCase() et toUpperClass() mais toLowerCase() et toUpperCase()
Hors ligne louf404 # Posté le 07/07/2009 à 18:13:29
Avatar

 J'ai essayé la regex du numéro de téléphone de ce chapitre afin de formater la chaine du champ quand l'utilisateur le désélectionne (onblur). Cela enlève juste les séparateurs des nombres. Or cela ne marche pas ici : pour la 2nd parenthèse, il ne prend en compte que le dernier chiffre o_O
(pour corriger le problème, j'ai du mettre 4 fois la même chose :euh: et là ça marche)
Hors ligne Xtrem2 # Posté le 10/04/2012 à 12:56:19

Avis : Mitigé

pas pour debutent

Voir tous les commentaires