Что такое includes в JavaScript: метод для массивов и строк

[hannadev]

Метод includes() в JavaScript — это простой способ проверить наличие элемента в массиве или подстроки в строке. Он возвращает true или false, что делает его удобным для быстрых проверок.

Зачем это нужно? В коде часто приходится искать, есть ли нужный элемент, без лишних вычислений. Это помогает избежать ошибок в логике, упрощает валидацию данных и ускоряет разработку. Мы разберём, как работает includes(), с примерами для массивов и строк.

includes() для массивов: как проверить наличие элемента

Метод Array.prototype.includes() ищет значение в массиве и возвращает логическое значение. Он проходит по элементам с начала или с указанного индекса и останавливается при первом совпадении. В отличие от indexOf(), includes() правильно обрабатывает NaN и учитывает типы строго.

Представьте массив пользователей на сайте. Нужно быстро узнать, есть ли среди них гость. includes() вернёт true, если элемент найден, и false иначе. Это полезно в условных конструкциях if, для фильтров или валидации форм. Логика простая: передаёте значение и опциональный fromIndex.

• searchElement: обязательный параметр — то, что ищем в массиве.
• fromIndex: необязательный, начинается поиск с этого индекса (по умолчанию 0, отрицательные значения считаются от конца).

Примеры использования для массивов

Пример	Код	Результат	Пояснение
Базовый поиск	['a', 'b', 'c'].includes('b')	true	Элемент найден.
С fromIndex	['a', 'b', 'c'].includes('a', 1)	false	Поиск с индекса 1, ‘a’ не найдено.
Отрицательный fromIndex	['a', 'b', 'c'].includes('b', -2)	true	Считается от конца: length + (-2).
NaN	[1, NaN, 3].includes(NaN)	true	indexOf() не сработал бы здесь.
Объекты	[{id:1}].includes({id:1})	false	Сравнивает ссылки, не значения.

includes() для строк: поиск подстроки

Метод String.prototype.includes() проверяет наличие подстроки в строке с учётом регистра. Он чувствителен к большим и малым буквам, ищет с начала или с позиции. Это отличный инструмент для парсинга текста, валидации ввода или поиска ключевых слов.

Например, проверяем, содержит ли сообщение слово «JavaScript». Метод вернёт true, если подстрока есть. Полезно в чатах, поисковиках или обработке пользовательского ввода. Второй аргумент задаёт стартовую позицию, что ускоряет поиск в длинных строках.

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

Сравнение includes() с другими методами строк

Метод	Возврат	Особенности	Когда использовать
includes()	true/false	Чувствителен к регистру, простой	Быстрая проверка наличия.
indexOf()	индекс / -1	То же, но возвращает позицию	Нужно знать позицию.
startsWith()	true/false	Только начало строки	Проверка префикса.
endsWith()	true/false	Только конец строки	Проверка суффикса.

Вот примеры:

const text = "JavaScript — это весело";
console.log(text.includes("Java")); // true
console.log(text.includes("java")); // false (регистр важен)
console.log(text.includes("Script", 5)); // true (с позиции 5)

Различия includes() в массивах и строках

В массивах метод сравнивает элементы строго (===), включая undefined и NaN. В строках ищет точное вхождение подстроки. Оба метода не мутируют оригинал и работают быстро для небольших коллекций. Но для объектов в массивах помните: сравниваются ссылки, а не содержимое.

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

• Массивы: идеально для примитивов, учитывает пробелы (undefined как undefined).
• Строки: не меняет регистр, пустая строка всегда true.
• Общее: второй аргумент fromIndex работает аналогично.

Сценарий	Массив	Строка	Рекомендация
Поиск по значению	Прямое сравнение	Подстрока	includes()
Большие данные	️ Медленнее find()	Быстро	Другие методы
Объекты	Ссылки	N/A	find() или lodash

Практические кейсы и подводные камни

includes() часто используют в формах: проверка, введён ли запретный символ. Или в роутинге: есть ли маршрут в списке разрешённых. Ещё пример — фильтр товаров: есть ли размер в наличии. Но будьте осторожны с объектами — всегда проверяйте ссылки.

В реальном проекте массив ролей пользователя. roles.includes('admin') быстро даёт доступ. Для строк: email.includes('@') валидирует почту на базовом уровне. Подводные камни: регистр в строках, типы в массивах (5 !== ‘5’).

• Валидация: input.includes('<script>') — блокировка XSS.
• Регистр: используйте toLowerCase() перед проверкой.
• Производительность: для тысяч элементов — Set или Map лучше.

Таблица типичных ошибок

Ошибка	Почему	Решение
false для объектов	Разные ссылки	Используйте find() с условием.
Регистр в строках	Чувствительность	str.toLowerCase().includes(...).
Медленный поиск	Большой массив	new Set(array).has(value).

Когда includes() не хватит

Метод includes() покрывает 80% простых проверок, но для сложных сценариев есть find(), some() или регулярки. Подумайте о Set для уникальных значений — has() быстрее. Или lodash для глубокого поиска. Это оставляет пространство для оптимизаций в крупных проектах.