JavaScript · Синтаксис · Начальный уровень

Методы строк

10 задач

Изучи встроенные методы строк в JavaScript — поиск, нарезка, замена, разбиение и форматирование текста с помощью шаблонных строк.

Краткое введение в тему и пояснения перед упражнениями (упражнения ниже):

Методы строк: поиск, преобразование, разбиение

#
Строки — один из самых используемых типов в JavaScript, и они поставляются с богатым набором встроенных методов. Знание этих методов заменяет множество ручных циклов. `length` — это свойство, не метод, поэтому скобки не нужны: ```javascript let name = "JavaScript"; console.log(name.length); // 10 ``` Смена регистра: `toUpperCase()` и `toLowerCase()` возвращают новую строку, не изменяя оригинал. Строки в JavaScript неизменяемы — каждый метод возвращает новое значение, не мутирует строку на месте. Удаление пробелов: `trim()` убирает пробелы, табуляцию и переносы строк с обоих концов. `trimStart()` и `trimEnd()` обрабатывают только одну сторону. Это важно при обработке пользовательского ввода, который часто приходит со случайными пробелами. Поиск внутри строки: - `includes(sub)` — возвращает true если подстрока есть где-либо - `startsWith(sub)` и `endsWith(sub)` — проверяют только начало или конец - `indexOf(sub)` — возвращает позицию (с нуля), или -1 если не найдено - `lastIndexOf(sub)` — то же, но сканирует справа налево Изменение содержимого: - `replace(old, new)` — заменяет только первое совпадение - `replaceAll(old, new)` — заменяет каждое совпадение - `split(separator)` — превращает строку в массив частей Две частые ошибки: `replace()` затрагивает только первое вхождение. Для всех — `replaceAll()` или regex с флагом `g`: `replace(/word/g, 'replacement')`. `indexOf()` возвращает -1 когда ничего не найдено — не null и не false. Всегда сравнивай явно: `if (idx !== -1)`, а не просто `if (idx)`. Результат 0 (подстрока на позиции 0) является falsy и будет ошибочно расценен как "не найдено". Ни один из этих методов не изменяет оригинальную строку. Результат нужно сохранять: `let clean = text.trim()`, а не просто `text.trim()`.

slice, padStart, шаблонные строки и цепочки методов

#
Эти четыре паттерна постоянно встречаются в реальном коде и покрывают большинство задач по обработке строк. **Извлечение частей через `slice`** ```javascript let filename = "report_2024.pdf"; let ext = filename.slice(filename.lastIndexOf(".")); // ".pdf" let name = filename.slice(0, filename.lastIndexOf(".")); // "report_2024" ``` `slice(start, end)` использует индексы от нуля и не включает конечную позицию. Отрицательные значения считаются с конца: `slice(-3)` берёт последние 3 символа. Комбинация `slice` с `lastIndexOf` — стандартный паттерн для разбиения имён файлов или URL по известному разделителю. **Дополнение для вывода фиксированной ширины** ```javascript let orderNum = 42; console.log(String(orderNum).padStart(6, "0")); // "000042" let label = "ok"; console.log(label.padEnd(10, ".")); // "ok........" ``` `padStart(targetLength, padChar)` заполняет левую сторону; `padEnd` — правую. Число нужно сначала конвертировать в строку — `padStart` работает только со строками. Полезно для номеров заказов, временных меток и выравнивания табличного вывода. **Шаблонные строки** ```javascript let user = "Alice"; let score = 98; console.log(`${user} scored ${score} points`); console.log(`Grade: ${score >= 90 ? "A" : "B"}`); ``` Шаблонные строки используют обратные кавычки, а не обычные. Всё внутри `${}` вычисляется как выражение JavaScript — можно вызывать функции, использовать тернарные операторы, делать арифметику. Используй их когда нужно вставить переменную в строку; конкатенация через `+` быстро становится неудобной. **Цепочки методов** ```javascript let raw = " Hello, World! "; let result = raw.trim().toLowerCase().replaceAll(",", ""); // "hello world!" ``` Каждый метод строки возвращает новую строку, поэтому вызовы можно объединить в одну строку. Читай слева направо: сначала trim, потом нижний регистр, потом удаление знаков препинания. Цепочка уместна когда каждый шаг понятен — если логика запутывается, лучше разбить на отдельные переменные.

Справочник методов строк

#
Быстрый справочник методов строк JavaScript. Все возвращают новую строку, если не указано иное. **Проверка** `str.length` — количество символов (свойство, без скобок) `str.includes(sub)` — true если sub есть где-либо `str.startsWith(sub)` — true если str начинается с sub `str.endsWith(sub)` — true если str заканчивается на sub `str.indexOf(sub)` — первая позиция sub, или -1 `str.lastIndexOf(sub)` — последняя позиция sub, или -1 **Преобразование** `str.toUpperCase()` — весь верхний регистр `str.toLowerCase()` — весь нижний регистр `str.trim()` — удалить пробелы с обоих концов `str.trimStart()` — удалить только слева `str.trimEnd()` — удалить только справа `str.replace(old, new)` — заменить первое совпадение `str.replaceAll(old, new)` — заменить все совпадения `str.padStart(len, char)` — дополнить слева до длины len `str.padEnd(len, char)` — дополнить справа до длины len `str.repeat(n)` — повторить строку n раз **Извлечение** `str.slice(start, end)` — подстрока по индексу; end не включается; отрицательные — с конца `str.split(sep)` — разбить на массив по разделителю; `split('')` — на отдельные символы **Шаблонные строки** `` `Hello, ${name}!` `` — вставить любое выражение через ${} `` `${a > b ? a : b}` `` — тернарные операторы, вызовы функций, арифметика — всё работает в ${}

Упражнения:

01

Trim и верхний регистр

#

Переменная `text` хранит строку с пробелами в начале и конце. Удали пробелы и преобразуй результат в верхний регистр.

let text = "  hello javascript  ";
// твой код здесь
Решение 
let text = "  hello javascript  ";
console.log(text.trim().toUpperCase());
02

Быстрая проверка email

#

Проверь, содержит ли строка `email` символ `"@"` и заканчивается ли на `".com"`. Выведи `true` или `false`.

let email = "[email protected]";
// твой код здесь
Решение 
let email = "[email protected]";
console.log(email.includes("@") && email.endsWith(".com"));
03

Разбить на слова

#

Разбей строку `sentence` на массив отдельных слов и выведи массив. Слова разделены пробелами.

let sentence = "JavaScript has many string methods";
// твой код здесь
Решение 
let sentence = "JavaScript has many string methods";
console.log(sentence.split(" "));
04

Заменить все вхождения

#

В строке `text` замени каждое вхождение слова `"cat"` на `"dog"` и выведи результат.

let text = "The cat sat on the mat. The cat liked it.";
// твой код здесь
Решение 
let text = "The cat sat on the mat. The cat liked it.";
console.log(text.replaceAll("cat", "dog"));
05

Найти позицию подстроки

#

Найди позицию первого вхождения `"script"` (без учёта регистра) в `text`. Если не найдено — выведи `"Not found"`, иначе — индекс.

let text = "JavaScript is a scripting language";
// твой код здесь
Решение 
let text = "JavaScript is a scripting language";
let idx = text.toLowerCase().indexOf("script");
if (idx !== -1) {
    console.log(idx);
} else {
    console.log("Not found");
}
06

Дополнить номер заказа

#

Отформатируй число `orderNum` как строку ровно из 6 символов, дополненную нулями слева. Например: `42` → `"000042"`.

let orderNum = 42;
// твой код здесь
Решение 
let orderNum = 42;
console.log(String(orderNum).padStart(6, "0"));
07

Проверить URL

#

Проверь, начинается ли URL в `url` с `"https"` и содержит ли `"."`. Выведи `true` или `false`.

let url = "https://example.com";
// твой код здесь
Решение 
let url = "https://example.com";
console.log(url.startsWith("https") && url.includes("."));
08

Имя файла без расширения

#

Переменная `path` хранит путь к файлу. Извлеки только имя файла без расширения (часть после последнего `"/"` и до последнего `"."`).

let path = "files/reports/summary_2024.pdf";
// твой код здесь
Решение 
let path = "files/reports/summary_2024.pdf";
let filename = path.slice(path.lastIndexOf("/") + 1);
let name = filename.slice(0, filename.lastIndexOf("."));
console.log(name);
09

snake_case в Title Case

#

Преобразуй строку из `snake_case` в Title Case: каждое слово с заглавной буквы, слова разделены пробелами. Пример: `"hello_world"` → `"Hello World"`.

let text = "hello_world_from_js";
// твой код здесь
Решение 
let text = "hello_world_from_js";
let result = text
    .split("_")
    .map(word => word[0].toUpperCase() + word.slice(1))
    .join(" ");
console.log(result);
10

Нормализация пользовательского ввода

#

Переменная `input` хранит сырой ввод с лишними пробелами, смешанным регистром и дефисами вместо пробелов. Нормализуй его: удали пробелы по краям, переведи в нижний регистр, замени все дефисы на пробелы.

let input = "  Hello-World-JavaScript  ";
// твой код здесь
Решение 
let input = "  Hello-World-JavaScript  ";
console.log(input.trim().toLowerCase().replaceAll("-", " "));