Tagged template literals позволяют функции обработать строку-шаблон, получив её статические и динамические части отдельно, что даёт полный контроль над финальным результатом.
Тег-функция получает два типа аргументов:
strings — массив статических сегментов строк...values — интерполированные выражения, распределённые как отдельные аргументыfunction tag(strings, ...values) {
// strings: ["Hello, ", "! You are ", " years old."]
// values: ["Alice", 30]
}
tag`Hello, ${name}! You are ${age} years old.`;
Функция может затем комбинировать или преобразовывать эти части любым нужным способом.
styled-components используют tagged templates для связи динамических стилей с React-компонентамиgql парсит строки-шаблоны в структурированные объекты запросовTagged template literals мощны тем, что дают разработчикам низкоуровневый доступ как к сырой структуре строки, так и к значениям во время выполнения шаблона. Это делает их идеальными для создания выразительных, безопасных и переиспользуемых абстракций — от UI-библиотек до query builders — без потери читаемости.
В tagged template literal массив strings всегда содержит на один элемент больше, чем массив values, независимо от того, сколько интерполяций присутствует.
Новый — ещё не проверен сообществом
Вы