Tagged Templates

JavaScript 🔴 Senior

Définition

Fonction appelée avec un template literal comme argument. Reçoit les parties statiques et les valeurs interpolées séparément, permettant un traitement personnalise.

Analogie

Un traducteur qui reçoit la phrase avec des trous et les mots a insérer, et peut modifier chaque mot avant de reconstruire la phrase.

Exemple de code

function highlight(strings, ...values) {
  return strings.reduce((acc, str, i) =>
    `${acc}${str}<b>${values[i] ?? ''}</b>`, '');
}
const name = 'Alice';
highlight`Hello ${name}!`;
// 'Hello <b>Alice</b>!'

Cas d'usage

Sanitisation HTML (lit-html), CSS-in-JS (styled-components), SQL sécurisé, i18n.

Termes liés

#core#avance#pattern

← → au clavier pour passer d'une fiche à l'autre