V8 adds template literals from  JavaScript ES6.

What are template literals

It’s a shorthand way of using a template into which variables are subsituted in a string. This allows for better reuse of string structures, and a few other goodies besides (like all V8 additions, it’s more than just a syntactical spruce up)

Using templates

We’ll use the same data, which I won’t bother repeating in each example as in Apps Script V8: spreading and destructuring

These are equivalent. The template allows the variables to insert their values into a string which has a placeholder set up to accept them. They differ from regular literals in that they use backticks rather than single (or double) quotes, and the template placeholder (if present) looks like this – ${somevariable}. 

These statements have the same outcome.

Evaluating expressions in templates

The placeholder can contain any expression, so you could do something like this this to conditionally set content.

Multiline literals

Long strings in JavaScript are a nuisance. V8 allows you to spread strings over multiple lines of code.

New lines in multline literals

Of course you can insert new lines in strings using \n, but with V8 multiline strings, the new lines (and spacing) are preserved. That can be great if you are using, say GraphQL, as you can now copy queries directly from graphiql without endless fiddling with quotes and \n.

This became such a pain for me in Apps Script that I created some helper functions to do it for me, Formatting GraphQL queries.

Sometimes though, you don’t actually want to keep the extra spacing and new lines that are preserved inside backticked quotes, so you have to undo them again – perhaps like this.

More than just syntax

Let’s create a concise logger for the next bit, as we eventually want to have a look at the nature of what’s being logged.

These are almost equivalent, but it looks like the backticked literal with no function brackets (which looks like very peculiar syntax) not only has some implied brackets to provoke function execution, but also passes some kind of array to the function it calls

Confirm it’s an array

The template structure

So this implied function execution provoked by the backticks is the mechanism that enables the template processing in the first place. If you use gql in GraphQL you may have been puzzled by the syntax (I certainly was), which looks something like this. What is happening here is that the backticks are simply provoking a call to the gql function, and passing something that looks a bit like a string to that function.

But this also means that we can take a look inside the the template by calling our own function using the behavior of the backtick. Templates used in this way are called tagged templates and allow you to do your own parsing and substitution.

First, make a logger to take multiple arguments

What actually gets passed in a tagged template is the string (as we’ve seen that’s an array), along with a value to fill each of the placeholders, and finally another array which is the version of str (.raw) without escapes (such as \n) rendered. So let’s create a function to examine what that looks like.

tagged template content

Here’s a sample of what you get back

Not only can you parse the templates this way, but you can also change their behavior! Let’s say, for example, that we wanted to look up a database using some of the values passed for evaluation. For simplicity, I’m looking up a list here, and omitting error checking and mitigation

Now we can customize populating the template, using the above function.

Summary

This is something I wish had been available when I started to use GraphQL with Apps Script. It would have saved lots of pain. Another great V8 feature.