0Pricing
JavaScript Academy · Lesson

Tagged Template Functions

Process template parts with tag functions.

What Is a Tag Function

A tagged template is a function call where the function name is placed directly before a template literal. The function receives the parsed pieces of the template and can transform them.

function tag(strings, value) {
  return strings[0] + value.toUpperCase() + strings[1]
}
console.log(tag(["Hi ", "!"], "bob"))

The Strings Array

The first argument a tag function receives is an array of the literal string parts. These are the chunks of text that sit between and around the placeholders.

function tag(strings) {
  return strings.join("|")
}
console.log(tag(["a", "b", "c"]))

All lessons in this course

  1. String Interpolation Basics
  2. Multiline Strings
  3. Tagged Template Functions
  4. Practical Tagged Template Use Cases
← Back to JavaScript Academy