Работа со строками: методы indexOf, substring, slice, split, trim и др.
Основы работы со строками в JavaScript
В JavaScript строки — это последовательности символов, с которыми можно выполнять множество операций. Рассмотрим ключевые методы, которые превратят вашу работу со строками из рутины в удовольствие! 🎻
🔍 Поиск в строках: indexOf() и includes()
Метод indexOf() возвращает индекс первого вхождения подстроки или -1, если ничего не найдено:
const phrase = "Hello, world!";
console.log(phrase.indexOf("world")); // 7
console.log(phrase.indexOf("Mars")); // -1 (не найдено)
А includes() просто говорит, есть ли подстрока (true/false):
console.log(phrase.includes("world")); // true
💡 Совет: Для чувствительного к регистру поиска используйте
toLowerCase()перед сравнением!
✂️ Извлечение подстрок: slice(), substring(), substr()
Эти методы похожи, но есть нюансы:
| Метод | Параметры | Особенности |
|---|---|---|
slice(start, end) |
Отрицательные значения разрешены | Не меняет исходную строку |
substring(start, end) |
Игнорирует отрицательные значения | Меняет местами start и end, если start > end |
substr(start, length) |
Устаревший метод | Второй параметр — длина подстроки |
Пример работы slice():
const text = "JavaScript";
console.log(text.slice(0, 4)); // "Java"
console.log(text.slice(-6)); // "Script" (отрицательный индекс)
🧩 Разделение строк: split()
Превращает строку в массив по разделителю:
const names = "Anna,Peter,John";
const namesArray = names.split(",");
console.log(namesArray); // ["Anna", "Peter", "John"]
Можно ограничить количество элементов:
"a-b-c-d".split("-", 2); // ["a", "b"] (только первые 2 элемента)
✨ Очистка строк: trim(), trimStart(), trimEnd()
Удаляют пробелы с краёв строки:
const messyString = " Hello! ";
console.log(messyString.trim()); // "Hello!"
console.log(messyString.trimStart()); // "Hello! "
console.log(messyString.trimEnd()); // " Hello!"
🛠️ Полезно при обработке пользовательского ввода в формах!
🔗 Склеивание строк: concat() и шаблонные строки
Хотя + работает, есть альтернативы:
const part1 = "Hello";
const part2 = "World";
console.log(part1.concat(" ", part2)); // "Hello World"
// Шаблонные строки (ES6) — золотой стандарт:
console.log(`${part1} ${part2}!`); // "Hello World!"
🎯 Практический пример: Парсинг URL
Применим знания в реальной задаче:
function parseURL(url) {
const [protocol, rest] = url.split("://");
const [domain, ...pathParts] = rest.split("/");
return {
protocol,
domain,
path: pathParts.join("/")
};
}
console.log(parseURL("https://example.com/blog/post"));
// { protocol: "https", domain: "example.com", path: "blog/post" }
🔥 Продвинутые трюки
1. Замена подстрок (до replace()):
const str = "I love apples";
const newStr = str.split("apples").join("oranges");
console.log(newStr); // "I love oranges"
2. Проверка пустой строки:
const input = " ";
console.log(input.trim() === ""); // true (только пробелы)
3. Обратный порядок символов:
"hello".split("").reverse().join(""); // "olleh"
Теперь вы вооружены мощными инструментами для работы со строками! Применяйте их в своих проектах и экспериментируйте — это лучший способ закрепить знания. 💪
Данила Бежин однажды сказал: "Строки — это как воздух программирования: их не видно, но без них никуда". Смотрите его разборы на YouTube для углублённого изучения!
