Новое в ES6: template literals (шаблонные строки)
С приходом версии ES6 в JavaScript стало возможным использование шаблонных литералов. Они в значительной степени упрощают работу со строками и переменными в JavaScript.
Если ранее мы писали так:
var val1 = 5;
var val2 = 10;
console.log('Сумма чисел ' + val1 + ' и ' + val2 + ' равна ' + (val1 + val2));
// 'Сумма чисел 5 и 10 равна 15'То теперь в ES6 благодаря template literals мы можем написать вот так:
var val1 = 5;
var val2 = 10;
console.log(`Сумма чисел ${val1} и ${val2} равна ${val1 + val2}`);
// 'Сумма чисел 5 и 10 равна 15'То есть мы интерполировали (подставили) значение переменных в строку.
Как можно заметить за место типичных одинарных и двойных кавычек, строка заключена в обратные кавычки(``). Это и превращает ее в шаблонный литерал, который может содержать подстановки переменных и выражений за счет знака доллара и фигурных скобок ${выражение} а также сохраняет форматирование, например переносы строк:
console.log(`Строка номер один
строка номер два`);
// "Строка номер один
// строка номер два"