Les chaînes et les littéraux de gabarit

"5" + 3 donne "53", pas 8. Quand l'un des côtés de + est une chaîne, JavaScript colle du texte au lieu d'additionner des nombres.

Le texte dans un programme

Les noms, les messages, les adresses, les mots de passe et des pages web entières sont du texte, et JavaScript stocke le texte sous forme de chaînes. Une chaîne est une suite de caractères entre guillemets. JavaScript accepte trois sortes de guillemets : les guillemets doubles "comme ceci", les guillemets simples 'comme ceci' et les accents graves `comme ceci`. Les deux premiers se comportent de la même façon. Les accents graves créent un littéral de gabarit (template literal), qui a des pouvoirs supplémentaires présentés plus bas.

Si ton texte contient une sorte de guillemet, entoure-le avec l'autre : "It's late" fonctionne, car l'apostrophe n'est pas un guillemet double. Tu peux aussi placer une barre oblique inversée avant un guillemet pour dire « celui-ci fait partie du texte » : 'It\'s late'. Une barre oblique inversée suivie de n, écrite \n, signifie un retour à la ligne dans la chaîne.

Longueur et positions

Chaque chaîne sait combien de caractères elle contient : "JavaScript".length vaut 10. Chaque caractère a aussi une position, appelée indice, et on commence à compter à 0, pas à 1. Dans "JavaScript", l'indice 0 est donc J, l'indice 4 est S et le dernier indice est 9, un de moins que la longueur. On lit un seul caractère avec des crochets : word[0]. Commencer à 0 paraît étrange au début, mais la plupart des langages de programmation comptent ainsi, et tu le retrouveras avec les tableaux.

const word = "JavaScript";
console.log(word.length);                // affiche 10
console.log(word[0]);                    // J (premier caractère)
console.log(word[word.length - 1]);      // t (dernier caractère)

Des méthodes de chaîne utiles

Les chaînes sont livrées avec des outils intégrés appelés méthodes, qu'on appelle avec un point après la chaîne. toUpperCase() et toLowerCase() renvoient une copie en majuscules ou en minuscules. includes("Script") répond true ou false selon que le texte apparaît dedans ou non. slice(0, 4) renvoie les caractères de l'indice 0 jusqu'à l'indice 4 exclu, c'est-à-dire "Java" dans "JavaScript". trim() supprime les espaces aux deux extrémités, pratique pour nettoyer ce qu'une personne a saisi. Aucune de ces méthodes ne modifie la chaîne d'origine. En JavaScript, les chaînes ne peuvent pas être modifiées sur place ; les méthodes renvoient toujours une nouvelle chaîne.

Coller des chaînes avec +

L'opérateur + colle des chaînes bout à bout : c'est la concaténation. "Hello, " + "Mina" donne "Hello, Mina". Les espaces ne sont pas ajoutées pour toi : mets-les toi-même entre les guillemets. Voici le piège annoncé au début : si l'un des côtés de + est une chaîne, JavaScript transforme l'autre côté en chaîne et les colle. "5" + 3 donne "53". Les autres opérateurs arithmétiques ne collent pas de texte : "5" * 2 convertit "5" en nombre et donne 10. Pour transformer une chaîne de chiffres en vrai nombre, utilise Number("5").

Les littéraux de gabarit

Construire une phrase avec + devient vite confus : name + " is " + age + " years old." demande de faire attention aux espaces et aux guillemets. Un littéral de gabarit, écrit entre accents graves, permet d'insérer directement des valeurs dans le texte avec ${ }. Ce qui se trouve entre les accolades est évalué comme une expression, et le résultat est placé dans la chaîne. Les littéraux de gabarit peuvent aussi s'étendre sur plusieurs lignes.

const name = "Mina";
const age = 14;
console.log(`${name} is ${age} years old.`);   // affiche Mina is 14 years old.
console.log(`Next year: ${age + 1}`);           // affiche Next year: 15

Exemple corrigé. Une étiquette de magasin doit indiquer "3 apples cost 4.5". Avec const n = 3, price = 1.5;, le gabarit `${n} apples cost ${n * price}` le fait en une ligne, et la multiplication a lieu entre les accolades.