Если вы используете шаблонные литералы только с заполнителями (например, ${expression}
), как в примере вопроса, тогда результат будет таким же, как только конкатенация строк. Субъективно он выглядит лучше и его легче читать, особенно для многострочных строк или строк, содержащих как '
, так и "
, поскольку вам больше не нужно скрывать эти символы.
Считываемость - это отличная особенность, но самое интересное в шаблонах - Tagged template literals :
let person = {name: 'John Smith'};
tag `My name is ${person.name}.`
Во второй строке этого примера вызывается функция с именем tag
. Содержимое строки шаблона разбивается на несколько переменных, доступ к которым можно получить в аргументах функций tag
: literal (в этом примере My name is
и .
) и подстановки (John Smith
). Литерал шаблона будет оцениваться независимо от функции tag
.
В ECMAScript wiki перечислены некоторые варианты использования, такие как автоматическое экранирование или ввод в кодировку или локализация. Вы можете создать функцию тега с именем msg
, которая просматривает литералы, такие как My name is
, и заменяет их переводами на язык текущей языковой версии, например, на немецкий язык:
console.log(msg`My name is ${person.name}.`) // Output: Mein Name ist John Smith.
Значение, возвращаемое функция тега даже не должна быть строкой. Предполагается, что этот селектор запросов возвращает коллекцию узлов DOM:
$`a.${className}[href=~'//${domain}/']`