Интерполяция строк в TypeScript: аналоги синтаксиса C#

Быстрый ответ

В TypeScript для интерполяции строк используйте шаблонные литералы, заключенные в обратные кавычки (`), и конструкцию ${} для вставки выражений:

const user = 'Боб';
const message = `Привет, ${user}!`;  // Результат: "Привет, Боб!"

Детальное рассмотрение

Создание многострочных строк

Одним из преимуществ шаблонных литералов является способность формировать многострочные строки без использования оператора +:

const item = 'кофейный напиток';
const quantity = 3;
console.log(`Вы заказали:
- ${quantity} чашечки ${item}`);

Выходной результат:

Вы заказали:
- 3 чашечки кофейного напитка

Чувствуется драматургия, не так ли?

Подробнее об этом расскажет наш спикер на видео

Вычисление выражений внутри строки

Выражения можно вычислять прямо внутри строк благодаря подстановкам:

const singlePrice = 2.5;
const orderQuantity = 3;
console.log(`К оплате: $${(singlePrice * orderQuantity).toFixed(2)}`); // "К оплате: $7.50"

Кто бы мог подумать, что математические расчеты могут производиться прямо в строках?

Вложенные шаблонные литералы

С помощью вложенных шаблонных литералов можно изящно скомбинировать строки:

const adjective = 'эпический';
const noun = 'сюжет';
console.log(`Это ${ `один ${adjective} ${noun}` } в проекте.`); // "Это один эпический сюжет в проекте."

Улучшение работы с кодом

Читаемость и поддерживаемость

Шаблонные литералы улучшают читаемость и поддерживаемость кода, позволяя:

• Минимизировать ошибки при конкатенации.
• Наглядно представить конечный вид строки.
• Упростить рефакторинг, не заботясь о последовательности складывания строк.

Аналогия с C# и TypeScript

Для программистов на C# синтаксис шаблонных литералов TypeScript напомнит об интерполяции строк в C#, что облегчит переход на TypeScript.

// В C#
string name = "мир";
string greeting = $"Привет, {name}!";

// В TypeScript
const name = 'мир';
const greeting = `Привет, ${name}!`;

Оба языка любят играть с фигурными скобками {} и строками. И впрямь они схожи, не находите?

Особенности и ловушки

• Используйте обратные кавычки (`), а не прямые, для интерполяции.
• Экранируйте символы обратных кавычек внутри шаблонов.
• Старайтесь избегать сложных выражений в подстановках, чтобы сохранить читаемость кода.

Продвинутые фокусы

Благодаря сложной системе типов в TypeScript можно использовать утонченные приемы для работы с интерполяцией строк:

• Определите типы, отражающие динамические значения строк.
• Примените вспомогательные типы для композиции на основе строк.
• Выполняйте прямую проверку шаблонов строк при формировании типов.

Визуализация

Шаблонные литералы в TypeScript позволяют вам адаптировать строки под заданные параметры:

Ваш дресс-код: "Оставайтесь спокойными и {глагол} {существительное}!"

Добавьте нужные слова:

const verb = 'пишите';
const noun = 'на TypeScript';
const motto = `Оставайтесь спокойными и ${verb} ${noun}!`;

Ваш лозунг готов:

Финальный вид: "Оставайтесь спокойными и пишите на TypeScript!"

Это похоже на заказ футболки с индивидуальным дизайном, только в коде. 🩳💻

Полезные материалы

1. Шаблонные литералы (шаблонные строки) – JavaScript | MDN – В деталях о работе со шаблонными строками на MDN Web Docs.
2. TypeScript: Руководство – Базовые типы — Официальная документация TypeScript по базовым типам.
3. TypeScript: Документация – Продвинутые типы – Полный обзор продвинутых типов в TypeScript, включая типы, созданные на основе шаблонных литералов.
4. TypeScript: Документация – Типы шаблонных литералов – Углубленный взгляд на типы шаблонных литералов и способы манипулирования строками в TypeScript.