Cosa sono i template literal e a cosa servono…

Letterali di template, noti anche stringhe template, sono uno zucchero sintattico in JavaScript che consente di incorporare espressioni nelle stringhe utilizzando backtick (``).

Vengono utilizzati per:

Interpolazione più comoda di variabili ed espressioni nelle stringhe:

const name = "Mondo";
const greeting = `Ciao, ${name}!`; // Integrazione di variabile
console.log(greeting); // Ciao, Mondo!

const sum = 2 + 3;
const result = `Somma: ${sum}.`; // Integrazione di espressione
console.log(result); // Somma: 5.

Creazione di stringhe multilinea senza usare il carattere di ritorno a capo (\n):

const multilineString = `
Questa
è una
stringa multilinea.
`;
console.log(multilineString);

Costruzione di espressioni di stringa complesse, come percorsi di file o query SQL, con maggiore leggibilità:
```
const userId = 123;
const query = `SELECT * FROM users WHERE id = ${userId}`;
console.log(query);
```

Utilizzo di template etichettati (tagged templates) per funzionalità estese: I template etichettati permettono di chiamare una funzione con una letterale di template. Il primo argomento della funzione è un array di parti di stringa, e gli argomenti successivi sono i valori delle espressioni interpolate.

function highlight(strings, ...values) {
  let str = '';
  strings.forEach((string, i) => {
    str += string;
    if (values[i]) {
      str += `<b>${values[i]}</b>`; // Ad esempio, evidenziare in grassetto
    }
  });
  return str;
}

const user = "Frontend";
const role = "sviluppatore";
const message = highlight`Ciao, ${user}! Sei un ${role}.`;
console.log(message); // Ciao, <b>Frontend</b>! Sei un <b>sviluppatore</b>.

In questo modo, le letterali di template rendono il lavoro con le stringhe in JavaScript più flessibile, comprensibile e aiutano a evitare complessità legate alla concatenazione di stringhe con il simbolo +.

Cosa sono i template literal e a cosa servono?