Интерполяция строк в JavaScript

Интерполяция строк — это процесс замены заполнителей в строке значениями строковой переменной [1].

Идея формировать готовую строку путём непосредственного внедрения в её шаблон соответствующих значений вместо заполнителей, которые указывают место их отображения, уже давно не нова. В частности, такая возможность уже давно поддерживается в PHP и, начиная с версии 6.0, в C#.

Программисты, использующие эти языки сразу же узнают знакомые приёмы работы.

На PHP:

$name = "Вася Пупкин";
echo "Меня зовут $name.";

1 2	$name = "Вася Пупкин"; echo "Меня зовут $name.";

На C#:

string name = "Вася Пупкин";
string result = $"Меня зовут {name}";

1 2	string name = "Вася Пупкин"; string result = $"Меня зовут {name}";

Удобно, не правда ли?

К сожалению, в JavaScript интерполяция строк долгое время не поддерживалась. Но, в ECMAScript 6 наконец-то появилась возможность её использования.

Для того чтобы напрямую вставить в строку значение из программы по аналогии с вышеприведёнными примерами, нужно заключить её в обратные кавычки «`», а само значение поместить внутри символов «${…}».

Например:

var name = "Вася Пупкин";
var result = `Меня зовут ${name}`;

1 2	var name = "Вася Пупкин"; var result = `Меня зовут ${name}`;

В интерполируемые строки можно поместить не только «готовое» значение, но и выражения:

var a = 1;
var result = `Результат ${a+1}`;

1 2	var a = 1; var result = `Результат ${a+1}`;

Также при необходимости можно использовать многоуровневую интерполяцию. Дело в том, что весь код внутри символов «${…}» воспринимается как единое выражение и поэтом, если он будет содержать обратные кавычки, они не будут считаться концом первоначальной строки.

var a= 20;
var product = "помидор";
var result = `Результат ${a+1+`килограмм ${product}`}`;

var a= 20;

var product = "помидор";

var result = `Результат ${a+1+`килограмм ${product}`}`;

Таким образом, работа со строками в JavaScript приобретает очень высокую гибкость, которой так не хватало ранее.

Источники:

Интерполяция строк в C#;

Добавить комментарий Отменить ответ