Tagged Templates

JavaScript 🔴 Senior

Definition

Fonction appelee avec un template literal comme argument. Recoit les parties statiques et les valeurs interpolees separement, permettant un traitement personnalise.

Analogie

Un traducteur qui recoit la phrase avec des trous et les mots a inserer, 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 securise, i18n.

Termes lies

#core#avance#pattern