Многострочные строки
Пишите удобочитаемый многострочный текст без управляющих последовательностей.
«Многострочные строки» — бесплатный урок JavaScript Academy на CoddyKit. Это урок 2 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения JavaScript Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс JavaScript Academy содержит 4 уроков всего.
Прежний способ
До появления шаблонных литералов для многострочной строки требовались явные управляющие последовательности перевода строки или конкатенация строк по нескольким строкам. Это было громоздко и часто приводило к ошибкам.
const old = "Line 1\nLine 2\nLine 3"
console.log(old)Шаблонные литералы занимают несколько строк
Шаблонный литерал, записанный с помощью обратных апострофов, может содержать настоящие переводы строк в исходном коде. Каждый введённый Вами перевод строки становится переводом строки в строке.
Выполняемый пример воспроизводит тот же результат с помощью управляющих последовательностей.
const text = "First\nSecond\nThird"
console.log(text)Пробельные символы сохраняются
Отступы и пробелы внутри многострочного шаблона сохраняются в точности так, как они записаны. Это важно при создании форматированного вывода.
const block = " indented\n more indented"
console.log(block)Формирование абзацев
Многострочные строки удобны для абзацев текста, тел электронных писем или шаблонов. Здесь мы составляем короткое сообщение.
const msg = "Dear user,\n\nThank you for joining.\n\nBest regards"
console.log(msg)Подсчёт строк
Многострочную строку можно разделить по символу перевода строки, чтобы подсчитать отдельные строки или обработать их.
const text = "a\nb\nc\nd"
const lines = text.split("\n")
console.log("Lines: " + lines.length)Объединение в многострочную строку
Массив строк можно объединить с разделителем в виде перевода строки, чтобы программно создать многострочную строку.
const parts = ["one", "two", "three"]
console.log(parts.join("\n"))Сочетание с интерполяцией
Многострочные шаблоны также могут содержать заполнители, объединяя динамические значения с переводами строк. В примере для демонстрации результата используется конкатенация.
const name = "Sam"
const body = "Hello " + name + ",\nWelcome aboard."
console.log(body)Табуляция и специальные символы
Даже внутри многострочных строк можно включать символы табуляции с помощью управляющей последовательности табуляции, чтобы выровнять столбцы.
const table = "Name\tAge\nAlice\t30\nBob\t25"
console.log(table)Удаление лишних строк
В многострочных строках иногда остаются пустые строки в начале или в конце. Метод trim удаляет окружающие пробельные символы, включая переводы строк.
const raw = "\n\nHello\n\n"
console.log("[" + raw.trim() + "]")Создание текста с кодом
Многострочные строки удобны для вывода фрагментов исходного кода или конфигурации в виде текста.
const code = "function add(a, b) {\n return a + b\n}"
console.log(code)Контроль длины строк
Помните, что многострочный шаблон включает каждый введённый Вами перевод строки. Случайные переводы строк могут добавить неожиданные пробелы, поэтому форматируйте текст намеренно.
const a = "no break here and here"
console.log(a.length)Быстрая проверка
Проверьте, насколько хорошо Вы поняли многострочные строки.
Итоги
Итоги: шаблонные литералы позволяют создавать настоящий многострочный текст.
- Переводы строк в исходном коде становятся переводами строк в строке
- Пробельные символы сохраняются в точности
- Сочетайте их с интерполяцией для создания динамических блоков
- Используйте split и join для обработки строк
console.log("Line A\nLine B")Часто задаваемые вопросы
Урок «Многострочные строки» бесплатный?
Да — полный текст урока «Многострочные строки» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс JavaScript Academy, подпишись на CoddyKit PRO. Курс JavaScript Academy содержит 4 уроков всего.
Чему я научусь в уроке «Многострочные строки»?
Пишите удобочитаемый многострочный текст без управляющих последовательностей. Ты практикуешь JavaScript Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.
Нужен ли мне опыт, чтобы начать JavaScript Academy?
Предыдущий опыт не требуется. JavaScript Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 2 из 4.
Сколько времени занимает урок «Многострочные строки»?
Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.
Можно ли писать и запускать код в этом уроке JavaScript Academy?
Да. Каждый урок JavaScript Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.
Все уроки этого курса
- Основы интерполяции строк
- Многострочные строки
- Функции с шаблонными тегами
- Практические сценарии применения шаблонных тегов