Méthodes de chaîne JavaScript
Méthodes de chaîne de base
Les chaînes JavaScript sont primitives et immuables : toutes les méthodes de chaîne produisent une nouvelle chaîne sans altérer la chaîne d'origine.
Longueur de la chaîne JavaScript
La propriété length renvoie la longueur d'une chaîne :
Exemple
let text = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
let length = text.length; Extraction des caractères de chaîne
Il existe 4 méthodes pour extraire des caractères d'une chaîne :
- La méthode
at( position ) - La méthode
charAt( position ) - La méthode
charCodeAt( position ) - Utilisation de l'accès par propriété [] comme dans les tableaux
Méthode charAt() de la chaîne JavaScript
La méthode charAt() renvoie le caractère à un index (position) spécifié dans une chaîne :
Exemple
let text = "HELLO WORLD";
let char = text.charAt(0); Méthode charCodeAt() de la chaîne JavaScript
La méthode charCodeAt() renvoie le code du caractère à un index spécifié dans une chaîne :
La méthode renvoie un code UTF-16 (un entier entre 0 et 65535).
Exemple
let text = "HELLO WORLD";
let char = text.charCodeAt(0); Méthode codePointAt() de JavaScript
Exemples
Obtenez la valeur du point de code à la première position dans une chaîne :
let text = "HELLO WORLD";
let code = text.codePointAt(0); Méthode at() de la chaîne JavaScript
ES2022 a introduit la méthode de chaîne at() :
Exemples
Obtenez la troisième lettre du nom :
const name = "formation-ti.org";
let letter = name.at(2); Obtenez la troisième lettre du nom :
const name = "formation-ti.org";
let letter = name[2]; La méthode at() renvoie le caractère à un index (position) spécifié dans une chaîne.
La méthode at() est prise en charge dans tous les navigateurs modernes depuis mars 2022 :
Remarque
La méthode at() est un nouvel ajout à JavaScript.
Elle permet l'utilisation d'index négatifs tandis que charAt() ne le permet pas.
myString.at(-2) au lieu de charAt(myString.length-2) . Support des navigateurs
at() est une fonctionnalité ES2022.
JavaScript 2022 est pris en charge dans tous les navigateurs modernes depuis mars 2022 :
| Chrome 92 | Edge 92 | Firefox 90 | Safari 15.4 | Opera 78 |
| Avr 2021 | Juil 2021 | Juil 2021 | Mar 2022 | Août 2021 |
Accès par propriété [ ]
Exemple
let text = "HELLO WORLD";
let char = text[0]; Remarque
L'accès par propriété peut être un peu imprévisible :
- Cela fait ressembler les chaînes à des tableaux (mais ce ne sont pas des tableaux)
- Si aucun caractère n'est trouvé, [ ] renvoie undefined, tandis que charAt() renvoie une chaîne vide.
- C'est en lecture seule. str[0] = "A" ne donne pas d'erreur (mais ne fonctionne pas !)
Exemple
let text = "HELLO WORLD";
text[0] = "A"; // Ne donne pas d'erreur, mais ne fonctionne pas
Méthode concat() de la chaîne JavaScript
concat() joint deux chaînes ou plus :
Exemple
let text1 = "Hello";
let text2 = "World";
let text3 = text1.concat(" ", text2); La méthode concat() peut être utilisée à la place de l'opérateur plus. Ces deux lignes font la même chose :
Exemple
text = "Hello" + " " + "World!";
text = "Hello".concat(" ", "World!"); Remarque
Toutes les méthodes de chaîne renvoient une nouvelle chaîne. Elles ne modifient pas la chaîne d'origine.
Formulons cela :
Les chaînes sont immuables : les chaînes ne peuvent pas être modifiées, seulement remplacées.
Extraction de parties de chaîne
Il existe 3 méthodes pour extraire une partie d'une chaîne :
-
slice( start , end ) -
substring( start , end ) -
substr( start , length )
Méthode slice() de la chaîne JavaScript
slice() extrait une partie d'une chaîne et renvoie la partie extraite dans une nouvelle chaîne.
La méthode prend 2 paramètres : position de départ et position de fin (fin non incluse).
Exemple
Extraire une portion d'une chaîne de la position 7 à la position 13 :
let text = "Apple, Banana, Kiwi";
let part = text.slice(7, 13); Remarque
JavaScript compte les positions à partir de zéro.
La première position est 0.
La deuxième position est 1.
Exemples
Si vous omettez le deuxième paramètre, la méthode extraira le reste de la chaîne :
let text = "Apple, Banana, Kiwi";
let part = text.slice(7); Si un paramètre est négatif, la position est comptée à partir de la fin de la chaîne :
let text = "Apple, Banana, Kiwi";
let part = text.slice(-12); Cet exemple extrait une portion d'une chaîne de la position -12 à la position -6 :
let text = "Apple, Banana, Kiwi";
let part = text.slice(-12, -6); Méthode substring() de la chaîne JavaScript
substring() est similaire à slice() .
La différence est que les valeurs de début et de fin inférieures à 0 sont traitées comme 0 dans substring() .
Exemple
let str = "Apple, Banana, Kiwi";
let part = str.substring(7, 13); Si vous omettez le deuxième paramètre, substring() extraira le reste de la chaîne.
Méthode substr() de la chaîne JavaScript
substr() est similaire à slice() .
La différence est que le deuxième paramètre spécifie la longueur de la partie extraite.
Avertissement
La méthode substr() est supprimée (dépréciée) dans la dernière norme JavaScript.
Utilisez substring() ou slice() à la place.
Exemple
let str = "Apple, Banana, Kiwi";
let part = str.substr(7, 6); Si vous omettez le deuxième paramètre, substr() extraira le reste de la chaîne.
Exemple
let str = "Apple, Banana, Kiwi";
let part = str.substr(7); Si le premier paramètre est négatif, la position est comptée à partir de la fin de la chaîne.
Exemple
let str = "Apple, Banana, Kiwi";
let part = str.substr(-4); Conversion en majuscules et en minuscules
Une chaîne est convertie en majuscules avec toUpperCase() :
Une chaîne est convertie en minuscules avec toLowerCase() :
Méthode toUpperCase() de la chaîne JavaScript
Exemple
let text1 = "Hello World!";
let text2 = text1.toUpperCase(); Méthode toLowerCase() de la chaîne JavaScript
Exemple
let text1 = "Hello World!"; // Chaîne
let text2 = text1.toLowerCase(); // text2 est text1 converti en minuscules Méthode isWellFormed() de la chaîne JavaScript
La méthode isWellFormed() renvoie true si une chaîne est bien formée.
Sinon, elle renvoie false .
Une chaîne n'est pas bien formée si elle contient des surrogates isolés .
Exemples
let text = "Hello world!";
let result = text.isWellFormed(); let text = "Hello World \uD800";
let result = text.isWellFormed(); Surrogates isolés
Un surrogate isolé est un point de code de surrogate Unicode qui ne fait pas partie d'une paire de surrogates valide utilisée pour représenter des caractères dans l'encodage UTF-16.
Méthode toWellFormed() de la chaîne JavaScript
La méthode de chaîne toWellFormed() renvoie une nouvelle chaîne où tous les "surrogates isolés" sont remplacés par le caractère de remplacement Unicode (U+FFFD).
Exemples
let text = "Hello World \uD800";
let result = text.toWellFormed(); Méthode trim() de la chaîne JavaScript
La méthode trim() supprime les espaces blancs des deux côtés d'une chaîne :
Exemple
let text1 = " Hello World! ";
let text2 = text1.trim(); Méthode trimStart() de la chaîne JavaScript
ECMAScript 2019 a ajouté la méthode de chaîne trimStart() à JavaScript.
La méthode trimStart() fonctionne comme trim() , mais supprime les espaces blancs uniquement au début d'une chaîne.
Exemple
let text1 = " Hello World! ";
let text2 = text1.trimStart();
Support des navigateurs
trimStart() est une fonctionnalité ECMAScript 2019 .
ES2019 est pris en charge dans tous les navigateurs modernes depuis janvier 2020 :
| Chrome 66 | Edge 79 | Firefox 61 | Safari 12 | Opera 50 |
| Avr 2018 | Jan 2020 | Juin 2018 | Sep 2018 | Mai 2018 |
Méthode trimEnd() de la chaîne JavaScript
ECMAScript 2019 a ajouté la méthode de chaîne trimEnd() à JavaScript.
La méthode trimEnd() fonctionne comme trim() , mais supprime les espaces blancs uniquement à la fin d'une chaîne.
Exemple
let text1 = " Hello World! ";
let text2 = text1.trimEnd();
Support des navigateurs
trimEnd() est une fonctionnalité ECMAScript 2019 .
ES2019 est pris en charge dans tous les navigateurs modernes depuis janvier 2020 :
| Chrome 66 | Edge 79 | Firefox 61 | Safari 12 | Opera 50 |
| Avr 2018 | Jan 2020 | Juin 2018 | Sep 2018 | Mai 2018 |
Remplissage de chaînes JavaScript
ECMAScript 2017 a ajouté deux nouvelles méthodes de chaîne à JavaScript : padStart() et padEnd() pour prendre en charge le remplissage au début et à la fin d'une chaîne.
Méthode padStart() de la chaîne JavaScript
La méthode padStart() remplit une chaîne depuis le début.
Elle remplit une chaîne avec une autre chaîne (plusieurs fois) jusqu'à atteindre une longueur donnée.
Exemples
Remplissez une chaîne avec "0" jusqu'à ce qu'elle atteigne la longueur 4 :
let text = "5";
let padded = text.padStart(4,"0"); Remplissez une chaîne avec "x" jusqu'à ce qu'elle atteigne la longueur 4 :
let text = "5";
let padded = text.padStart(4,"x"); Remarque
La méthode padStart() est une méthode de chaîne.
Pour remplir un nombre, convertissez d'abord le nombre en chaîne.
Voir l'exemple ci-dessous.
Exemple
let numb = 5;
let text = numb.toString();
let padded = text.padStart(4,"0"); Support des navigateurs
padStart() est une fonctionnalité ECMAScript 2017 .
ES2017 est pris en charge dans tous les navigateurs modernes depuis septembre 2017 :
| Chrome 58 | Edge 15 | Firefox 52 | Safari 11 | Opera 45 |
| Avr 2017 | Avr 2017 | Mar 2017 | Sep 2017 | Mai 2017 |
Méthode padEnd() de la chaîne JavaScript
La méthode padEnd() remplit une chaîne depuis la fin.
Elle remplit une chaîne avec une autre chaîne (plusieurs fois) jusqu'à atteindre une longueur donnée.
Exemples
let text = "5";
let padded = text.padEnd(4,"0"); let text = "5";
let padded = text.padEnd(4,"x"); Remarque
La méthode padEnd() est une méthode de chaîne.
Pour remplir un nombre, convertissez d'abord le nombre en chaîne.
Voir l'exemple ci-dessous.
Exemple
let numb = 5;
let text = numb.toString();
let padded = text.padEnd(4,"0"); Support des navigateurs
padEnd() est une fonctionnalité ECMAScript 2017 .
ES2017 est pris en charge dans tous les navigateurs modernes depuis septembre 2017 :
| Chrome 58 | Edge 15 | Firefox 52 | Safari 11 | Opera 45 |
| Avr 2017 | Avr 2017 | Mar 2017 | Sep 2017 | Mai 2017 |
Méthode repeat() de la chaîne JavaScript
La méthode repeat() renvoie une chaîne contenant un certain nombre de copies d'une chaîne.
La méthode repeat() renvoie une nouvelle chaîne.
La méthode repeat() ne modifie pas la chaîne d'origine.
Exemples
Créez des copies d'un texte :
let text = "Hello world!";
let result = text.repeat(2); let text = "Hello world!";
let result = text.repeat(4); Syntaxe
string .repeat( count ) Paramètres
| Paramètre | Description |
| count | Requis. Le nombre de copies souhaitées. |
Valeur de retour
| Type | Description |
| Chaîne | Une nouvelle chaîne contenant les copies. |
Support des navigateurs
repeat() est une fonctionnalité ES6 .
ES6 est entièrement pris en charge dans tous les navigateurs modernes depuis juin 2017 :
| Chrome 51 | Edge 15 | Firefox 54 | Safari 10 | Opera 38 |
| Mai 2016 | Avr 2017 | Juin 2017 | Sep 2016 | Juin 2016 |
Remplacement du contenu de la chaîne
La méthode replace() remplace une valeur spécifiée par une autre valeur dans une chaîne :
Exemple
let text = "Veuillez visiter Microsoft !";
let newText = text.replace("Microsoft", "formation-ti.org");
Remarque
La méthode replace() ne change pas la chaîne sur laquelle elle est appelée.
La méthode replace() renvoie une nouvelle chaîne.
La méthode replace() remplace uniquement la première correspondance
Si vous souhaitez remplacer toutes les correspondances, utilisez une expression régulière avec le drapeau /g activé. Voir les exemples ci-dessous.
Par défaut, la méthode replace() remplace uniquement la première correspondance :
Exemple
let text = "Veuillez visiter Microsoft et Microsoft !";
let newText = text.replace("Microsoft", "formation-ti.org");
Par défaut, la méthode replace() est sensible à la casse. Écrire MICROSOFT (en majuscules) ne fonctionnera pas :
Exemple
let text = "Veuillez visiter Microsoft !";
let newText = text.replace("MICROSOFT", "formation-ti.org");
Pour remplacer sans tenir compte de la casse, utilisez une expression régulière avec un drapeau /i (insensible) :
Exemple
let text = "Veuillez visiter Microsoft !";
let newText = text.replace(/MICROSOFT/i, "formation-ti.org");
Remarque
Les expressions régulières sont écrites sans guillemets.
Pour remplacer toutes les correspondances, utilisez une expression régulière avec un drapeau /g (correspondance globale) :
Exemple
let text = "Veuillez visiter Microsoft et Microsoft !";
let newText = text.replace(/Microsoft/g, "formation-ti.org");
Remarque
Vous en apprendrez beaucoup plus sur les expressions régulières dans le chapitre Expressions régulières JavaScript .
Méthode ReplaceAll() de la chaîne JavaScript
En 2021, JavaScript a introduit la méthode de chaîne replaceAll() :
Exemple
text = text.replaceAll("Chats","Chiens");
text = text.replaceAll("chats","chiens"); La méthode replaceAll() vous permet de spécifier une expression régulière au lieu d'une chaîne à remplacer.
Si le paramètre est une expression régulière, le drapeau global (g) doit être activé, sinon une TypeError est levée.
Exemple
text = text.replaceAll(/Chats/g,"Chiens");
text = text.replaceAll(/chats/g,"chiens");
Remarque
replaceAll() est une fonctionnalité ES2021 .
replaceAll() ne fonctionne pas dans Internet Explorer.
Conversion d'une chaîne en tableau
Si vous souhaitez travailler avec une chaîne comme un tableau, vous pouvez la convertir en tableau.
Méthode split() de la chaîne JavaScript
Une chaîne peut être convertie en tableau avec la méthode split() :
Exemple
text.split(",") // Diviser sur des virgules
text.split(" ") // Diviser sur des espaces
text.split("|") // Diviser sur des barres verticales Si le séparateur est omis, le tableau renvoyé contiendra la chaîne entière à l'index [0].
Si le séparateur est "", le tableau renvoyé sera un tableau de caractères uniques :
Exemple
text.split("") Référence complète de JavaScript
Pour une référence complète à toutes les propriétés et méthodes JavaScript, avec des descriptions complètes et de nombreux exemples, rendez-vous sur :
Référence complète de JavaScript de formation-ti.org .
La référence inclut toutes les mises à jour JavaScript de 1999 à 2025.