Sobes.tech
Junior

Qu'est-ce que les littéraux de modèle et à quoi servent-ils?

sobes.tech IA

Réponse de l'IA

Les littéraux de gabarit, également appelés chaînes de gabarit, sont un sucre syntaxique en JavaScript qui permet d’intégrer des expressions dans des chaînes en utilisant des accents graves (``).

Ils sont utilisés pour :

  1. Une interpolation plus pratique des variables et des expressions dans les chaînes :

    const name = "Monde";
    const greeting = `Bonjour, ${name} !`; // Insertion de variable
    console.log(greeting); // Bonjour, Monde !
    
    const sum = 2 + 3;
    const result = `Somme : ${sum}.`; // Insertion d’une expression
    console.log(result); // Somme : 5.
    
  2. Créer des chaînes multilignes sans utiliser le caractère de saut de ligne (\n) :

    const multilineString = `
    Ceci
    est une
    chaîne multilignes.
    `;
    console.log(multilineString);
    
  3. Construction d’expressions de chaînes complexes, telles que des chemins de fichiers ou des requêtes SQL, avec une meilleure lisibilité :

    const userId = 123;
    const query = `SELECT * FROM users WHERE id = ${userId}`;
    console.log(query);
    
  4. Utilisation de gabarits étiquetés (tagged templates) pour une fonctionnalité étendue : Les gabarits étiquetés permettent d’appeler une fonction avec une littérale de gabarit. Le premier argument de la fonction est un tableau de parties de chaînes, et les arguments suivants sont les valeurs des expressions interpolées.

    function highlight(strings, ...values) {
      let str = '';
      strings.forEach((string, i) => {
        str += string;
        if (values[i]) {
          str += `<b>${values[i]}</b>`; // Par exemple, mettre en gras
        }
      });
      return str;
    }
    
    const user = "Frontend";
    const role = "développeur";
    const message = highlight`Bonjour, ${user} ! Tu es un ${role}.`;
    console.log(message); // Bonjour, <b>Frontend</b> ! Tu es un <b>développeur</b>.
    

Ainsi, les littéraux de gabarit rendent le travail avec des chaînes en JavaScript plus flexible, compréhensible et évitent les complexités liées à la concaténation de chaînes avec le symbole +.