Template Literals

Writing out strings with variables inside used to be pretty unwieldy in Javascript, especially with multi-line strings. ES6 added major changes to strings, although you can still use the older method of var + 'myString' as well. I still use that in places where it's shorter and cleaner.

syntax

back-tick: ` Template literals use a funky character that you may be familiar with if you've written code blocks in markdown: the back-tick. While it looks a bit foreign at first, they make strings easy to spot.

const name = 'Spot';

 console.log(`my dog is named ${ name }`);    

variables

${ variable } While at first this seems a little complicated for a simple string, at least the variables/expressions are clearly delineated.

const firstName = 'Sancho';
const lastName = 'Panza';

console.log(`name is ${ firstName } ${ lastName }`);

javascript inside You can also so more when them - you can use a ternary expression or even a function inside of your placeholder.

const firstName = '';

console.log(`name is ${ firstName ? firstName : 'Bob' }`);