Поиск в строке JavaScript

Поиск в строке нужен, когда мы хотим понять, есть ли внутри текста нужное слово, буква или символ.

let email = 'user@example.com';

console.log(email.includes('@'));

Результат:

true

В строке есть символ @, поэтому метод includes() вернул true.

Что значит поиск в строке

Строка состоит из символов. JavaScript умеет искать в ней отдельный символ, слово или часть текста.

let message = 'Я изучаю JavaScript';

console.log(message.includes('JavaScript'));
console.log(message.includes('Python'));

Результат:

true
false

Первое значение найдено, второе - нет.

Проверка через includes()

includes() проверяет, есть ли одна строка внутри другой. Результатом будет true или false.

let text = 'Frontend разработчик';

console.log(text.includes('Frontend'));
console.log(text.includes('Backend'));

Результат:

true
false

Этот метод удобно использовать в условиях.

let comment = 'Спасибо за урок!';

if (comment.includes('спасибо')) {
  console.log('Комментарий содержит благодарность');
}

Но этот пример ничего не выведет, потому что в строке слово начинается с большой буквы. К регистру вернемся ниже.

Поиск позиции через indexOf()

indexOf() ищет строку и возвращает индекс, с которого она начинается.

let text = 'Я изучаю JavaScript';

console.log(text.indexOf('JavaScript'));

Результат:

9

Слово JavaScript начинается с индекса 9.

Если значение не найдено, indexOf() возвращает -1.

let text = 'Я изучаю JavaScript';

console.log(text.indexOf('Python'));

Результат:

-1

Поэтому в условиях результат обычно сравнивают с -1.

let text = 'HTML, CSS, JavaScript';

if (text.indexOf('HTML') !== -1) {
  console.log('HTML найден');
}

Не стоит проверять indexOf() просто как условие. Если найденное значение начинается с индекса 0, условие может сработать не так, как ожидается.

Поиск с определенной позиции

У includes() и indexOf() можно указать позицию, с которой начинать поиск.

let text = 'JavaScript и JavaScript';

console.log(text.indexOf('JavaScript'));
console.log(text.indexOf('JavaScript', 1));

Результат:

0
13

Первый поиск начинается с начала строки. Второй - с индекса 1, поэтому первое совпадение пропускается.

С includes() это работает похоже.

let text = 'JavaScript и JavaScript';

console.log(text.includes('JavaScript', 1));

Результат:

true

Поиск с конца через lastIndexOf()

lastIndexOf() ищет последнее вхождение строки и возвращает его индекс.

let text = 'one, two, one';

console.log(text.indexOf('one'));
console.log(text.lastIndexOf('one'));

Результат:

0
10

indexOf() нашел первое one, а lastIndexOf() - последнее.

startsWith() и endsWith()

Иногда нужно проверить не всю строку, а только ее начало или конец.

startsWith() проверяет, начинается ли строка с указанного текста.

let url = 'https://learnjs.ru';

console.log(url.startsWith('https://'));

Результат:

true

endsWith() проверяет конец строки.

let fileName = 'photo.jpg';

console.log(fileName.endsWith('.jpg'));

Результат:

true

Регистр важен

Поиск в строках учитывает регистр. Для JavaScript ‘Привет’ и ‘привет’ - разные строки.

let message = 'Привет';

console.log(message.includes('Привет'));
console.log(message.includes('привет'));

Результат:

true
false

Если нужно искать без учета регистра, можно привести обе строки к одному регистру.

let message = 'Привет';
let search = 'привет';

console.log(message.toLowerCase().includes(search.toLowerCase()));

Результат:

true

Что выбрать

Если нужно просто узнать, есть ли текст внутри строки, чаще всего подойдет includes().

email.includes('@');

Если нужно узнать позицию найденного текста, используйте indexOf().

email.indexOf('@');

Если важно начало или конец строки, удобнее использовать startsWith() и endsWith().

Итого

Для поиска в строке есть несколько удобных методов.

  • includes() проверяет наличие текста и возвращает true или false.
  • indexOf() возвращает индекс найденного текста или -1.
  • lastIndexOf() ищет последнее вхождение.
  • startsWith() проверяет начало строки.
  • endsWith() проверяет конец строки.
  • Поиск учитывает регистр.