Template literals verwenden Backticks (`) und fügen zwei Dinge hinzu, die gewöhnliche Anführungszeichen nicht haben: Interpolation von Ausdrücken und mehrzeilige Strings.
js
name = ;
count = ;
msg = ;
total = ;
html = ;
Template literals verwenden Backticks (`) und fügen zwei Dinge hinzu, die gewöhnliche Anführungszeichen nicht haben: Interpolation von Ausdrücken und mehrzeilige Strings.
name = ;
count = ;
msg = ;
total = ;
html = ;
Vor template literals schriebst du "Hi " + name + ", " + count + ... — wortreich und fehleranfällig. Interpolation liest sich viel besser.
Eine Funktion, die vor den Backticks platziert wird, empfängt die Stringteile und die interpolierten Werte, was ihr erlaubt, diese zu verarbeiten:
function highlight(strings, ...values) {
return strings.reduce((out, s, i) =>
out + s + (values[i] ? `<b>${values[i]}</b>` : ""), "");
}
highlight`Hello ${name}!`; // "Hello <b>Ann</b>!"
Dies ermöglicht Bibliotheken wie styled-components und sichere SQL/HTML-Escaping-Helfer.
Template literals sind heute die Standardmethode zum Erstellen von Strings — lesbare Interpolation, einfache mehrzeilige Texte und ein Hook (tagged templates) für DSLs.