Littéraux de modèle JavaScript
Synonymes :
- Modèles littéraux
- Chaînes de modèle
- Modèles de chaînes
- Syntaxe Back-Tics
Syntaxe Back-Tics
Les modèles littéraux utilisent des back-ticks (``) plutôt que les guillemets ("") pour définir une chaîne :
Exemple
let text = `Hello World!`;
Citations à l'intérieur des chaînes
Avec les modèles littéraux , vous pouvez 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 littéraux de modèle autorisent les chaînes multilignes :
Exemple
let text =
`The quick
brown fox
jumps over
the lazy dog`;
Interpolation
Les littéraux de modèle permettent d'interpoler facilement des variables et des expressions dans des chaînes.
La méthode est appelée interpolation de chaîne.
La syntaxe est :
${...}
Substitutions variables
Les littéraux de modèle autorisent les variables dans les chaînes :
Exemple
let firstName = "John";
let lastName = "Doe";
let text = `Welcome ${firstName}, ${lastName}!`;
Le remplacement automatique des variables par des valeurs réelles est appelé interpolation de chaîne .
Substitution d'expressions
Les littéraux de modèle autorisent les expressions dans les chaînes :
Exemple
let price = 10;
let VAT = 0.25;
let total = `Total: ${(price * (1 + VAT)).toFixed(2)}`;
Le remplacement automatique des expressions par des valeurs réelles est appelé interpolation de chaîne .
Modèles HTML
Exemple
let header = "Templates Literals";
let tags = ["template literals", "javascript", "es6"];
let html = `<h2>${header}</h2><ul>`;
for (const x of tags) {
html += `<li>${x}</li>`;
}
html += `</ul>`;
Prise en charge du navigateur
Template Literals
est une fonctionnalité ES6 (JavaScript 2015).
Il est pris en charge dans tous les navigateurs modernes :
Chrome | Edge | Firefox | Safari | Opera |
Yes | Yes | Yes | Yes | Yes |
Template Literals
n'est pas pris en charge dans Internet Explorer.
Référence de chaîne complète
Pour une référence complète de String, rendez-vous sur :
Référence de chaîne JavaScript complète .
La référence contient des descriptions et des exemples de toutes les propriétés et méthodes de chaîne.