JSadvancedes2015

Tagged template literals

Put a function in front of a backtick string and rewrite the interpolation.

A tag is just a function called with the template's literal string pieces and its interpolated values handed over separately — letting you escape, transform, or capture every ${value} before it ever joins the surrounding text, which is the foundation of html-escapers, styled-components, and parameterised SQL builders.

A tag receives strings and values separately

JSintro
Press Run to execute

The tag receives strings as ["", " is a ", "!"] and the values as ["Chiron", "tutor"] — separate arrays, so the 3 static pieces always outnumber the 2 ${} slots by one. This split is what lets a tag inspect or neutralise each value before it ever touches the surrounding text.