Modèles de chaînes JavaScript
Modèles de chaînes
Chaînes de modèle
Littéraux de modèle
Un enfant bien-aimé a de nombreux noms.
Syntaxe des back-ticks
Les chaînes de modèle utilisent des back-ticks (``) plutôt que des guillemets ("") pour définir une chaîne :
Exemple
let text = `Hello World!`;
Guillemets à l'intérieur des chaînes
Les chaînes de modèle permettent d'utiliser à la fois des guillemets simples et doubles à l'intérieur d'une chaîne :
Exemple
let text = `He's often called "Johnny"`;
Chaînes multilignes
Les chaînes de modèle permettent des chaînes multilignes :
Exemple
let text =
`The quick
brown fox
jumps over
the lazy dog`;
Interpolation
Les chaînes de modèle permettent d'utiliser des variables dans les chaînes.
Les chaînes de modèle offrent un moyen facile d' interpoler des variables dans les chaînes.
Syntaxe
${...} Exemple
Substitutions de variables :
let firstName = "John";
let lastName = "Doe";
let text = `Welcome ${firstName}, ${lastName}!`;
Substitution d'expressions
Les chaînes de modèle permettent l'interpolation d'expressions dans les chaînes :
Exemple
let price = 10;
let VAT = 0.25;
let total = `Total: ${(price * (1 + VAT)).toFixed(2)}`;
Modèles HTML
Exemple
let header = "Chaînes de modèle";
let tags = ["chaînes de modèle", "javascript", "es6"];
let html = `<h2>${header}</h2><ul>`;
for (const x of tags) {
html += `<li>${x}</li>`;
}
html += `</ul>`;
Support des navigateurs
Les chaînes de modèle sont 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 |
Référence complète des chaînes
Pour une référence complète des chaînes, consultez notre :
Référence complète des chaînes JavaScript .
La référence contient des descriptions et des exemples de toutes les propriétés et méthodes des chaînes.