DEV Community

How to Create Multi-Line String with Template Literals

Samantha Ming on April 29, 2019

With the arrival of Template Literals, it's finally super easy to produce multi-line strings. Previously, we had to use the \n or separate string...

Read full post

Florian Rand • Apr 29 '19

Another good addition to template literals is writing more readable code, for example:

const name = 'Peter'
const age = 35

//instead of the classic concatenation
console.log(name + " is only " + age + " old!")

//we can write something like this:
console.log(`${name} is only ${age} old!`)

Youth • Apr 30 '19

It also works

console.log(`%s is only %d old!`,name,age)

Samantha Ming • Apr 30 '19

Totally! String interpolation is probably one of my most used ES6 feature 💯

Florian Rand • Apr 30 '19

Same here! Btw I forgot to mention great article! (Concentrated writing the example totally forgot about being polite 😁)

Samantha Ming • May 1 '19

You’re welcome! Btw, thanks for jumping back and leaving this kind comment 😊 You’re making this community really nice to a part of 💛

David Dal Busco • Apr 30 '19

Interesting. Does it work cross OS?

Let's say I implement the "ES6 console.log way - first example here above" on a Unix kernel, if I share the code with someone on a Windows kernel, it will be interpreted with "multi-lines" too (\n vs \r\n)?

Florian Rand • Apr 30 '19

JavaScript runs in the browser 😅

David Dal Busco • Apr 30 '19

Hahaha it should yes 😂

Let's say that my question applies in case I would run the code on the API side or as a local script 😉

It's probably good, I just that I faced so often encoding errors in the past that I was curious about it

Florian Rand • Apr 30 '19

Interesting, Im going ti do some tests later at home with a Windows machine

David Dal Busco • Apr 30 '19

Super cool 🚀

Namstel • Apr 30 '19

I love template literals. I remember having to write HTML templates with the '"\n" +'-notation. So messy, so easy to make mistakes. Great article for beginners!

Samantha Ming • Apr 30 '19

Same! And you pointed out the biggest benefit, it helps reduce errors. That’s why clean code so important, it makes it easier to spot errors. And template literals definitely accomplishes that! 💯