Template Literal

what is a template Literal and what does it mean?
Secondly how exactly string interpolation works and what is expression and placeholder this topic has made my confused so badly?
please explain it in a very easy terms, beacuse i already searched it alot i didn’t get anything?

Welcome to the forums!

A template literal is a string that allows for expressions to be inserted within them. These expressions could be variables, mathematical operations, etc. String interpolation is simply the process of replacing the placeholders for these expressions in the template literals with actual values. A placeholder consists of the following syntax: ${expression}. Note that we must always surround template literals with backticks (`).


let year = 2020;

console.log(`The year is ${year}.`); // prints The year is 2020.

In the above example, `The year is ${year}.` is a template literal, year (the one inside the curly braces) is an expression, ${year} is a placeholder, and the process of replacing ${year} with 2020 is string interpolation.

See the documentation for more.


Lost in translation.



are like single and double quotes. To show one, we use the other, and vice-versa. There’s some white space as well.

Triple space single space triple will give a single visible tick in the prose, as will single space triple space single give a triple tick in the prose.

1 Like

Not only do we finally have a decent method of string interpolation, we have a very useful string delimiter`` is now the de facto quotation mark since it gives all strings immediate interpolation ability. They are just characters as the system sees them, so no big change up there. We can wrap all our string objects in ticks.

That means that we can forget about escapes in the majority of cases owing that now we can use both single and double quotes in prose.

We should have a topic in Random about this. What scenarios DO NOT allow the use of ticks instead of quotes? I’ve not found any, yet, but can’t give any definitive proof of edge cases where quotes must be used.

JS is a pretty tolerant API. I vote for ticks in every scenario and leave the quotes to prose.

Another less obvious feature of template literals (`${x}`) is that expression means, any expression, including other template literals. Yes, we can nest these puppies! And there is no limit.

Expressions are anything that yields a value. Thanks to the architecture of the language we can write programs that are almost completely based upon them.

1 Like

As far as I am aware (of which I am not very), JS is a programming language, not an API. A quick Google search yielded me that programming languages in general are not APIs. Mind explaining this a bit further?

It is a language, but how do we get it to play along in the browser?

Yes, I would prefer to have the correct terms in use, so amenable to amendment.

Ah, yes, I get it now. I was thinking that JS could also be used outside of the browser.

1 Like

In Node.js we can get free of the browser, but in a program almost more based on C than ES.

1 Like

Nice to know! Thanks for the explanation. :slight_smile:

1 Like

any expression

Which includes logical expressions, ternaries and function calls. We can really drill down when building the output string object. Everything summarized in one string. Something to think upon?