ES6 has two new kinds of literals: template literals and tagged template literals.
- Template literals are string literals with support for interpolation and multiple lines.
- Tagged template literals (short: tagged templates): are function calls whose parameters are provided via template literals.
This is a new kind of string literal allows to use multiple line strings and expression
Template literals are enclosed by the back-tick
`...` character instead of double or single quotes.
Expressions can be indicated by the Dollar sign and curly braces
The above code is equivalent to the below ES5 standard code
Tagged template literals
A more advanced form of template literals are tagged template literals. With them you are able to modify the output of template literals using a function. The first argument contains an array of string literals ("Hello " , " world", and "" in this example). The second, and each argument after the first one, are the values of the processed (or sometimes called cooked) substitution expressions ("15" and "50" here). In the end, your function returns your manipulated string. There is nothing special about the name tag in the following example. The function name may be anything you want.
raw property, available on the first function argument of tagged template literals, allows you to access the raw strings as they were entered.