Sofiane Boumedine Lexique Dev

Tagged Template Literals

JavaScript 🟡 Mid

Type : Concept

Definition

Les tagged templates permettent de traiter un template literal avec une fonction. La fonction recoit les parties statiques et les expressions interpolees separement, offrant un controle total sur le rendu.

Analogie

Un traducteur qui recoit la structure de ta phrase et les mots-cles separement, et peut les transformer avant de construire la phrase finale.

Exemple de code

function sql(strings, ...values) {
  return strings.reduce((q, s, i) =>
    q + s + (values[i] !== undefined ? class="str">`$${i + 1}` : class="str">''), class="str">'');
}
const query = sqlclass="str">`SELECT * FROM users WHERE id = ${42}`;

Cas d'usage

Creer des requetes SQL parametrees, du CSS-in-JS (styled-components) ou un systeme d'internationalisation.

coreinterview-question