#literals

Template Literals are basically a superset of string literals (instantiations of strings), they contain all the normal string functionality and add more on top. One of the most basic features is support for multiline strings without any extra syntax:

const string1 = 'A very very long paragraph. That continues on for\n \ a few sentences. Including this sentence.' const string2 = `A very very long paragraph. That continues on for a few sentences. Including this sentence.`

Making it easy to write long strings (just strip out newlines via \n replace) or create nicely formatted text blocks. String replacement is also much easier to read since there are less formatters like +:

const a = 2, b = 3; console.log('2 + 4 = ' + (a + b) + ' total'); // 2 + 4 = 6 total console.log(`2 + 4 = ${a + b} total`); // 2 + 4 = 6 total console.log('2 + 4 = ' + (2 + 4) + ' total'); // 2 + 4 = 6 total console.log(`2 + 4 = ${2 + 4} total`); // 2 + 4 = 6 total

There are other features like Tagged Template Literals, but I have not found them to be useful yet.

Template literals are supported in every browser, include MS Edge, but not IE 11 (and earlier). Template literals are also slower when replaces are done compared to string literals in most environments. As indicated by the JsPerf test that I created (Try it in Chrome): https://jsperf.com/template-literal-vs-string-literal-es6-only/1. So Template literals should be used when there is support for it and performance is not an issue due to reduced syntax.