Fortgeschrittene Verarbeitung mit Tagged Templates

Snippet

Fortgeschrittene Verarbeitung mit Tagged Templates

Tagged Templates ermöglichen es, Template-Literale mit einer Funktion zu parsen. Das erste Argument enthält ein Array von String-Literalen, die weiteren Argumente sind die Werte der Ausdrücke. Dies ist nützlich für DSLs, das Bereinigen von HTML oder Internationalisierung.

snippet.js
javascript
function sanitize(strings, ...values) {
  return strings.reduce((acc, str, i) => {
    let val = String(values[i] || '');
    return acc + str + val.replace(/&/g, '&amp;').replace(/</g, '&lt;');
  }, '');
}
 
const input = '<script>alert(1)</script>';
const message = sanitize`User input: ${input}`;
console.log(message); // User input: &lt;script>alert(1)&lt;/script>

Erklärung

function sanitize(strings, ...values)

Eine Tag-Funktion, die String-Teile und interpolierte Werte getrennt erhält.

strings.reduce((acc, str, i) => ...)

Iteriert durch die Strings und Werte, um das Endergebnis zu rekonstruieren.

val.replace(/</g, '<')

Wendet eine Validierungslogik auf die interpolierten Werte an, bevor sie zusammengefügt werden.

Vorheriges Snippet Nächstes Snippet

Verwandt

Aus deiner Bibliothek