javascript / intermediate
Snippet
Tagged Template Literals
Tagged Templates ermöglichen es, Template-Literale mit einer Funktion zu verarbeiten. Das erste Argument ist ein Array von String-Literalen, und die restlichen Argumente sind die ausgewerteten Ausdrücke.
snippet.js
1
2
3
4
5
6
7
8
9
10
11
12
function highlight(strings, ...values) {return strings.reduce((acc, str, i) => {const val = values[i] ? `[${values[i]}]` : '';return acc + str + val;}, '');}const author = 'Maria';const action = 'escaped';const message = highlight`${author} has ${action}!`;console.log(message); // [Maria] has [escaped]!
Erklärung
1
function highlight(strings, ...values) { ... }
Die 'Tag'-Funktion, die die String-Teile und die interpolierten Werte verarbeitet.
2
highlight`${author}...`
Aufruf der Tag-Funktion ohne Klammern durch Voranstellen vor das Template-Literal.