Templates de chaînes de caractères JavaScript

Synonymes :

  • Templates Literals
  • Chaînes de caractères
  • Templates de chaînes de caractères
  • Syntaxe des back-ticks

Syntaxe des back-ticks

Littéraux de templateUtilisez les backticks (``) plutôt que les guillemets ("") pour définir une chaîne de caractères :

Exemple

let text = `Hello World!`;

Essayez-le vous-même

Les guillemets dans les chaînes de caractères

En utilisantLittéraux de template，Vous pouvez utiliser à la fois les guillemets simples et doubles dans une chaîne de caractères :

Exemple

let text = `He's often called "Johnny"`;

Essayez-le vous-même

Chaînes de caractères multilignes

Littéraux de templatePermet des chaînes de caractères multilignes :

Exemple

let text =
The quick
brown fox
saut par-dessus
the lazy dog`;

Essayez-le vous-même

Interpolation

Littéraux de templateFournit une méthode simple pour insérer des variables et des expressions dans des chaînes de caractères.

Cette méthode est appelée interpolation de chaînes de caractères (string interpolation).

Syntaxe

${...}

Remplacement de variable

Littéraux de templatePermet des variables au sein des chaînes de caractères :

Exemple

let firstName = "Bill";
let lastName = "Gates";
let text = `Welcome ${firstName}, ${lastName}!`;

Essayez-le vous-même

L'utilisation automatique de valeurs réelles pour remplacer des variables est appeléeInterpolation de chaînes de caractères.

Remplacement d'expression

Littéraux de templatePermet des expressions au sein des chaînes de caractères :

Exemple

let price = 10;
let VAT = 0.25;
let total = `Total: ${(price * (1 + VAT)).toFixed(2)}`;

Essayez-le vous-même

L'utilisation automatique de valeurs réelles pour remplacer des expressions est appelée interpolation de chaînes de caractères.

Template 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>`;

Essayez-le vous-même

Support du navigateur

Internet Explorer ne prend pas en chargeLittéraux de template.

La première version de navigateur qui prend en charge pleinement les littéraux de template est :

Chrome IE Firefox Safari Opera
Chrome 41 Edge 13 Firefox 34 Safari 10 Opera 29
Mars 2015 Novembre 2015 Décembre 2014 Septembre 2016 Avril 2015

Référence complète des chaînes

Pour une référence complète, veuillez visiter notre site complet Manuel de référence des chaînes JavaScript.

Ce manuel contient des descriptions et des exemples de toutes les propriétés et méthodes des chaînes.