Sometimes you need to combine multiple strings with constants or variables, for example when printing "My name is". If you use normal string concatenation, it looks like this:

const name = "Kayn";
console.log("My name is " + name);

That style has a few disadvantages.

  1. It becomes hard to read when you have multiple variables or expressions:
"Hello " + firstName + " " + lastName + ", you are " + age + " years old.";
  1. Multi-line strings require explicit \n:
"Line1\nLine2\nLine3";

That is why JavaScript has template literals, a newer form of string literal:

  • They are wrapped with backticks: `.
  • They support variable or expression interpolation through ${}.
  • They support multi-line strings without \n.

The syntax looks like this:

const name = "Kayn";
console.log(`My name is ${name}`);

Advantages:

  1. Better readability.
    Writing ${variable} is closer to natural language and easier to scan.
`Hello ${firstName} ${lastName}, you are ${age} years old.`;
  1. Multi-line strings are much easier.
    You can just press Enter instead of manually writing \n.
`Line1
Line2
Line3`;
  1. You can embed arbitrary expressions.
`Next year, you'll be ${age + 1} years old.`;