В этом посте мы рассмотрим действительно полезные литералы шаблонов. Что вы можете с ними сделать?
Использование литералов шаблонов
- Смешайте одинарные и двойные кавычки без использования обратной косой черты
- Упрощенное смешивание переменных, выражений и строк
- Писать многострочные тексты проще
Смешивание одинарных и двойных кавычек
Прежде всего, они находятся между обратными кавычками (`) вместо одинарных или двойных кавычек.
e.g.
const text = `Baz Roberts`;Это означает, что нам не нужно беспокоиться о том, какой тип кавычек мы используем внутри обратных галочек.
e.g.
const text2 = `Barrie's called "Baz"`;Как видите, у нас есть сочетание одинарных и двойных кавычек, но между обратными кавычками это нормально.
e.g.
const text3 = "Barrie's called \"Baz\"";Раньше нам приходилось использовать обратную косую черту, чтобы избежать кавычек, когда мы хотели использовать их как часть строки.
Смешивание переменных со строками
Что мне действительно нравится в литералах шаблонов, так это то, что они значительно упрощают смешивание строк и переменных.
e.g.
const v = 1000000;
const text4 = `Baz's website "bazroberts.com" has had over ${v} visitors.`;
Logger.log(text4); //Baz's website has had over 1000000 visitors.Здесь у нас есть переменная v, которая содержит количество посетителей. Я хочу добавить его в предложение, и для этого мы используем синтаксис ${}и помещаем переменную в середину фигурных скобок.
Чтобы сравнить это со старым способом сделать это:
e.g.
const text5 = "Baz's website \"bazroberts.com\" has had " + v + " visitors.";
Logger.log(text5); //Baz's website has had 1000000 visitors.С литералами шаблонов нет необходимости постоянно открывать и закрывать кавычки или избегать кавычек, которые вы хотите использовать.
Это называется интерполяцией строк.
Смешивание выражений со строками и переменными
Мы также можем добавлять выражения прямо в литерал шаблона.
e.g.
const cost = 100;
const profit = 0.05;
const price = `The price is ${cost * (1 + profit)} dollars.`;
Logger.log(price); //The price is 105 dollars.Как видите, мы можем легко смешивать строки, переменные и выражения, как в этом расчете цены.
Многострочные строки
Мы также можем использовать литералы шаблонов для более удобного написания многострочных строк.
e.g.
const multiLineText = `This text
has more than
one line.`;
Logger.log(multiLineText);
/*
This text
has more than
one line.
*/Раньше нам приходилось использовать символ новой строки и знак «плюс», что гораздо менее элегантно.
const multiLineText2 = "This text\n" + "has more than\n" + "one line.";
Logger.log(multiLineText2);Экранирование знака доллара и обратной галочки
К сожалению, мы не можем избежать обратной косой черты (извините, ужасный каламбур!). Бывают случаи, когда мы можем захотеть включить в нашу строку знак доллара или обратную галочку. Для этого мы используем обратную косую черту перед знаком доллара или обратной галочкой, которую хотим включить в строку.
e.g.
const price2 = 105;
Logger.log(`The price is \$${price2} dollars.`); //The price is $105 dollars.Как видите, в строку включен знак доллара.
Литералы шаблонов удивительно просты, но значительно облегчают написание JavaScript и Apps Script.
Обратите внимание, что этот сайт ориентирован на скрипт приложений, поэтому приведенные выше примеры сосредоточены на использовании JavaScript в скрипте приложений, поэтому выше используется Logger.log. Узнать больше Скрипт приложений здесь.
Этот пост взят из моей книги Основы JavaScript для пользователей скриптов приложений.
