Tagged template literals позволяют обработать template literal с помощью пользовательской функции, давая тебе полный контроль над тем, как будет построена финальная строка.
Тег-функция размещается прямо перед template literal. Она автоматически получает:
strings — массив статических частей строки...values — интерполированные выражения как отдельные аргументыfunction tag(strings, ...values) {
return strings[0] + values[0].toUpperCase();
}
const name = "world";
tag`Hello, ${name}!`; // "Hello, WORLD"
Тег-функция может возвращать что угодно — строку, объект или даже DOM-элемент.
styled-components используют tagged templates для привязки CSS-стилей прямо к React-компонентамTagged template literals — это мощный инструмент метапрограммирования. Вместо простого форматирования строк они позволяют тебе перехватывать и трансформировать как статические, так и динамические части template, что делает их идеальными для задач безопасности, стилизации и построения слоёв абстракции в современных JavaScript-приложениях.
Функция-тег получает статические части строки в виде массива в первом параметре, а интерполированные выражения — как отдельные аргументы через rest параметры.
Новый — ещё не проверен сообществом
Вы