Hvad er template literals?

Question

Accepted Answer

**Template literals** bruger backticks (`` ` ``) og tilføjer to ting, som almindelige strenganførselstegn mangler: **interpolation** af udtryk og **multi-line** strenge. ```js const name = "Ann"; const count = 3; // interpolation: ${expression} const msg = `Hi ${name}, you have ${count} new messages`; // any expression works, not just variables const total = `Total: ${(count * 1.1).toFixed(2)}`; // multi-line — preserves the line breaks const html = `

${name}

`; ``` Før template literals skulle du skrive `"Hi " + name + ", " + count + ...` — ordrig og fejlbetinget. Interpolation læses meget bedre. ## Tagged templates (advanced) En funktion placeret før backticks modtager strengdelene og de interpolerede værdier, så den kan behandle dem: ```js function highlight(strings, ...values) { return strings.reduce((out, s, i) => out + s + (values[i] ? `${values[i]}` : ""), ""); } highlight`Hello ${name}!`; // "Hello Ann!" ``` Dette giver kraft til biblioteker som **styled-components** og sikre SQL/HTML escaping-hjælpere. ## Hvorfor det betyder noget Template literals er standardmåden at bygge strenge på i dag — læsbar interpolation, nemme multi-line tekster og en hook (tagged templates) til DSLs.