Retour au cours

Chaînes modernes : littéraux de gabarits et interpolation (ES6)

JavaScript : Le cours complet pour débutant, de « Zéro à Héros »

15. Littéraux de gabarits (Template Literals / Backticks)

Les littéraux de gabarits, introduits dans ES6, sont définis à l'aide de backticks (`) au lieu de guillemets. Ils résolvent deux problèmes majeurs des chaînes traditionnelles.

1. Interpolation de chaînes

Permet d'intégrer des variables et des expressions directement à l'intérieur de la chaîne en utilisant le format ${expression}.

javascript let item = 'Ordinateur'; let price = 1200;

// Concaténation traditionnelle : // let summary = 'L' ' + item + ' coûte ' + price + ' €.';

// Utilisation des littéraux de gabarits (beaucoup plus propre) : let summary = L'${item} coûte ${price * 1.05} € (taxes incluses).;

console.log(summary); // Résultat : L'Ordinateur coûte 1260 € (taxes incluses).

2. Chaînes multi-lignes

Les littéraux de gabarits vous permettent de définir une chaîne sur plusieurs lignes sans utiliser de caractères de nouvelle ligne \n.

javascript let htmlContent = <div> <h1>Bienvenue !</h1> <p>Ceci est une chaîne multi-lignes.</p> </div>; console.log(htmlContent);

Bonne pratique : Utilisez toujours les littéraux de gabarits, sauf si vous avez spécifiquement besoin de guillemets simples ou doubles.