Javascript ES6 - Template Literals

Template Literals are used to concatenate two strings and it can contain placeholders for javascript variables. Placeholder syntax for javascript - ${expression}

Single line Template Literals -

Old way - 

let name = 'Arun';
let greeting = 'Good Morning';
 
let message = 'Hi! ' + name + ', ' + greeting;
console.log(message);
 
 
Output - Hi! Arun, Good Morning
 

The new way of using ES6 template literals -

let name = 'Arun';
let greeting = 'Good Morning';
 
let message = `Hi! ${name}, ${greeting}`;
console.log(message);
 
Output - Hi! Arun, Good Morning
 

Here we used backticks ( ` )  to strings concatenation.

Multi-line Template Literals -

Old way - 

let name = 'Arun';
let greeting = 'Good Morning';
 
let message = 'Hi! ' + name + '\n' +
                        'How are you?';
console.log(message);
 
Output - 

Hi! Arun
How are you?
 

The new way of using ES6 template literals -

let name = 'Arun';
let greeting = 'Good Morning';
 
let message = `Hi! ${name}
How are you?`;
console.log(message); 

Output - 

Hi! Arun
How are you?