O que são literais de template e para que são usados…

Literais de template, também conhecidos como strings de template, são um açúcar sintático em JavaScript que permite incorporar expressões em strings usando crases (``).

São usados para:

Interpolação mais conveniente de variáveis e expressões em strings:

const name = "Mundo";
const greeting = `Olá, ${name}!`; // Inserção de variável
console.log(greeting); // Olá, Mundo!

const sum = 2 + 3;
const result = `Soma: ${sum}.`; // Inserção de expressão
console.log(result); // Soma: 5.

Criar strings multilinha sem usar o caractere de nova linha (\n):

const multilineString = `
Isto
é uma
string multilinha.
`;
console.log(multilineString);

Construção de expressões de strings complexas, como caminhos de arquivos ou consultas SQL, com maior legibilidade:
```
const userId = 123;
const query = `SELECT * FROM users WHERE id = ${userId}`;
console.log(query);
```

Uso de templates etiquetados (tagged templates) para funcionalidade estendida: Templates etiquetados permitem chamar uma função com uma literal de template. O primeiro argumento da função é um array de partes de strings, e os argumentos seguintes são os valores das expressões interpoladas.

function highlight(strings, ...values) {
  let str = '';
  strings.forEach((string, i) => {
    str += string;
    if (values[i]) {
      str += `<b>${values[i]}</b>`; // Por exemplo, destacar em negrito
    }
  });
  return str;
}

const user = "Frontend";
const role = "desenvolvedor";
const message = highlight`Olá, ${user}! Você é um ${role}.`;
console.log(message); // Olá, <b>Frontend</b>! Você é um <b>desenvolvedor</b>.

Assim, os literais de template tornam o trabalho com strings em JavaScript mais flexível, compreensível e evitam complexidades relacionadas à concatenação de strings usando o símbolo +.

O que são literais de template e para que são usados?