2.7. Les Template Strings

Avant de terminer avec les nouveautés d’ES6, je voulais vous expliquer comment utiliser les templates strings. C’est une petite amélioration d’ES6 bien sympathique !

Jusqu’à maintenant, concaténer des chaînes de caractères était pénible en JavaScript, il fallait ajouter des symboles « + » les uns à la suite des autres :

let someText = "duTexte"; 
let someOtherText = "unAutreTexte"; 
let embarrassingString = someText; 
 
embarrassingString += " blabla"; 
embarrassingString += someText; 
embarrassingString += "blabla";
embarrassingString += someOtherText;
 
return embarrassingString;

Comme vous pouvez le constater, c’était assez pénible, et cela augmente les erreurs d’inattention.

Mais avec ES6, on peut utiliser des templates strings, qui commencent et se terminent par un backtick (`). Il s’agit d’un symbole particulier qui permet d’écrire des chaînes de caractères sur plusieurs lignes.

// On peut écrire des strings sur plusieurs ligne grâce au backtick !
let severalLinesString = `bla 
 blablalbalblalballb 
 balblablalabla 
 b 
 ablablablabbl`; 
 
// .. mais pas avec des guillemets ! 
// Ce code va lever une erreur ! 
let severalLinesStringWithError = "bla 
 blba 
 blbla 
 blabla"

On peut même insérer des variables dans la chaîne de caractères avec ${}, comme ceci :

return `${this.name} a pour email : ${this.email}`;

Bref, il est bien pratique ce backtick, pas vrai ? 😉