Проверка подстроки в JavaScript: 3 способа для новичков

«Содержит ли эта строка то слово?» — вопрос, который мучает каждого новичка

Вы пишете скрипт, получаете ответ от сервера или просто фильтруете список городов. И вдруг встаёте в тупик: как проверить, содержит ли строка определённую подстроку в JavaScript? Этот вопрос — настоящий хит на Stack Overflow, его задают тысячи разработчиков. И не зря: строки — основа любого приложения, а умение быстро искать в них подстроки — базовый навык.

В этом туториале мы разберём три рабочих способа: от самого современного (и любимого всеми) до классического с плюшками. Вы узнаете, когда какой метод использовать, и научитесь писать код, который не стыдно показать на собеседовании.

Метод №1: includes() — простота и элегантность

Если вы пишете код на современном JavaScript (ES6 и выше), то includes() — ваш лучший друг. Этот метод возвращает true или false и читается как обычный английский вопрос: «Строка включает подстроку?».

Синтаксис

string.includes(searchString, position)

• searchString — то, что мы ищем (обязательно).
• position — необязательный параметр, с какого индекса начинать поиск (по умолчанию 0).

Пример в действии

const message = "Привет, мир! JavaScript — это круто.";

console.log(message.includes("JavaScript")); // true
console.log(message.includes("Python"));     // false
console.log(message.includes("мир", 10));    // false (поиск с 10-го символа)

Обратите внимание: метод чувствителен к регистру. "javascript" и "JavaScript" — разные строки. Если вам нужно игнорировать регистр, просто приведите обе строки к нижнему регистру:

const text = "Изучаем JavaScript";
const keyword = "javascript";

console.log(text.toLowerCase().includes(keyword.toLowerCase())); // true

Когда использовать

• Валидация форм (проверка email на наличие "@").
• Поиск по списку (фильтрация товаров).
• Любая простая проверка на вхождение.

Метод №2: indexOf() — классика, которая не умирает

До появления includes() все пользовались indexOf(). Он не просто говорит «да/нет», а возвращает индекс первого вхождения подстроки. Если подстрока не найдена, вернёт -1.

Синтаксис

string.indexOf(searchValue, fromIndex)

Пример

const sentence = "Я люблю JavaScript и Python.";

console.log(sentence.indexOf("люблю")); // 2
console.log(sentence.indexOf("Ruby"));  // -1

// Проверка на вхождение
if (sentence.indexOf("JavaScript") !== -1) {
    console.log("Да, строка содержит JavaScript!");
}

Тонкий момент: почему не !== -1?

Многие новички пишут if (str.indexOf("word")) — и это ошибка. Если подстрока находится в самом начале (индекс 0), условие if (0) считается false. Всегда сравнивайте с -1.

Когда использовать indexOf() вместо includes()

• Когда нужен индекс начала подстроки (например, чтобы вырезать часть строки).
• Работа со старым кодом (IE и древние версии браузеров).
• Когда нужно найти все вхождения (в цикле с изменением fromIndex).

Метод №3: search() и RegExp — когда нужна гибкость

А что, если вам нужно найти не просто слово, а шаблон? Например, «все слова, начинающиеся на "JS"» или «номер телефона в формате +7-xxx-xxx-xx-xx». Тут на помощь приходят регулярные выражения и метод search().

Синтаксис

string.search(regexp)

Возвращает индекс первого совпадения или -1, если ничего не найдено.

Пример с регулярным выражением

const text = "Мой email: example@mail.com, а телефон: +7-999-123-45-67.";

// Проверка наличия email
console.log(text.search(/@\w+\.\w+/)); // 10 (индекс начала email)

// Проверка наличия цифр
console.log(text.search(/\d/)); // 4 (первая цифра — 7)

// Игнорирование регистра
console.log(text.search(/example/i)); // 10

Когда RegExp — единственный вариант

• Поиск по маске (номера, даты, URL).
• Проверка на наличие только букв или только цифр.
• Сложные условия: «содержит хотя бы одну заглавную букву и цифру».

Бонус: match() — если нужно не просто проверить, а достать

Метод match() похож на search(), но возвращает массив совпадений (или null). Идеально, когда вы не просто проверяете, а хотите извлечь данные.

const str = "Цена: 1500 рублей, скидка: 300 рублей.";
const prices = str.match(/\d+/g);
console.log(prices); // ["1500", "300"]

Сравнительная таблица: какой метод выбрать?

Метод	Возвращает	Регистрозависимость	Поддержка RegExp	Когда использовать
includes()	true / false	Да	Нет	Простая проверка
Блоги Как использовать регулярные выражения в Python? Как устроиться Java разработчиком: советы и резюме на практике Профилирование Java кода: находим узкие места для начинающих Рекомендаций по книгам Паттерны проектирования на PHP: практическое руководство Kotlin и Docker: контейнеризация приложений GraphQL на C++: Создаём современные API Разработка игр для iOS с Unity3D Читайте также Мониторинг Go приложений: метрики и алерты на продвинутом уровне Чат-боты на TypeScript: полный гайд по созданию с нуля 10 лучших фреймворков PHP для продвинутой веб-разработки wait() vs sleep() в Java: что выбрать для тредов? Микросервисы на JavaScript: архитектура и практика для Node.js 🍪 Сначала примите условия Чтобы войти на сайт, необходимо принять соглашение об использовании файлов cookie. Мы используем их для авторизации и улучшения работы сайта. Политика конфиденциальности Принять и продолжить Закрыть 🍪 Мы используем файлы cookie для авторизации, аналитики и улучшения работы сайта. Продолжая пользоваться сайтом, вы соглашаетесь с нашей политикой конфиденциальности. Принять Только необходимые