JS метод String.includes()

Загальний опис

String.prototype.includes() є методом, який дозволяє перевірити, чи містить рядок вказаний підрядок. Цей метод повертає true, якщо підрядок знайдено всередині головного рядка, і false у протилежному випадку. Ця функціональність є надзвичайно корисною для умовних перевірок у коді, наприклад, при аналізі вводу користувача, фільтруванні даних або роботі з текстом.

Для використання includes() потрібно викликати його на рядковому об'єкті, передаючи підрядок як аргумент. Ось простий приклад:

let sentence = "Hello, world!";
let word = "world";
console.log(sentence.includes(word)); // виведе true

Також можна вказати другий аргумент, який визначає позицію у рядку, з якої почати пошук. Наприклад:

console.log(sentence.includes("Hello", 1)); // виведе false, бо пошук починається з індексу 1

Слід звернути увагу, що includes() є чутливим до регістру, тому "hello" та "Hello" будуть різними рядками:

console.log(sentence.includes("hello")); // виведе false

Особливістю includes() є його простота і зручність у порівнянні зі старішими методами, такими як indexOf(), який повертає індекс підрядка або -1, якщо підрядок не знайдено. Використання includes() робить код чистішим і зрозумілішим, особливо для новачків.

Нотатка:	Пам'ятайте, що метод `String.prototype.includes()` чутливий до регістру. Це означає, що він розрізняє великі та малі букви. Наприклад, `'JavaScript'.includes('script')` поверне `false`, оскільки "s" у "script" написано маленькою буквою, а у слові "JavaScript" - великою. У випадку, коли потрібно ігнорувати регістр, можна використовувати метод `toLowerCase()` або `toUpperCase()` перед `includes()`.
Нотатка:	Метод `includes()` дозволяє вказати, з якого індексу розпочати пошук. Це може бути корисним для пошуку підрядка в певній частині рядка. Наприклад, `'JavaScript'.includes('a', 3)` почне шукати літеру "a" починаючи з четвертого символу (індекс 3), і поверне `true`.
Нотатка:	`includes()` є зручним для перевірки наявності певного підрядка перед виконанням певних дій. Наприклад, `if (str.includes('Hello')) { /* код, який виконується, якщо str містить 'Hello' */ }` Це допомагає писати більш читабельний і зрозумілий код.
Нотатка:	Хоча `includes()` та `indexOf()` обидва використовуються для перевірки наявності підрядка, важливо розуміти різницю. `includes()` повертає булеве значення (true або false), в той час як `indexOf()` повертає індекс першого входження підрядка або -1, якщо підрядок не знайдено. Використовуйте `includes()`, коли вам потрібно лише знати, чи містить рядок підрядок, а `indexOf()` - коли потрібно дізнатися його позицію.

Синтаксис

includes(searchString)
includes(searchString, position)

Параметри

*searchString: Це рядок, який буде шукатися всередині основного рядка. Не може бути регулярним виразом. Усі значення, які не є регулярними виразами, автоматично конвертуються у рядки, тому пропуск аргументу або передача undefined призведе до пошуку рядка "undefined", що рідко є бажаним результатом.
position: Позиція всередині рядка, з якої почнеться пошук searchString. Якщо не вказано, за замовчуванням встановлюється на 0, тобто пошук відбувається з початку рядка.

Return

boolean: Повертає булеве значення (true або false). Якщо рядок пошуку (searchString) знайдено деінде у заданому рядку, метод повертає true, це також стосується випадків, коли searchString є порожнім рядком; у всіх інших випадках повертається false. Цей результат дозволяє легко перевірити наявність підрядка у більшому рядку, що є особливо корисним у умовних конструкціях та валідації даних.

Переглядачі

Переглядач
	41	40	9	28	12

Переглядач
	41	41	40	9

Переглядач
	4.0.0	1.0

Приклади

У цьому прикладі користувач вводить будь-який текст у перше поле вводу та підрядок, який треба знайти, у друге. Натискаючи на кнопку, відбувається перевірка, чи містить введений текст заданий підрядок, та відповідний результат виводиться на екран.


  See the Pen <a href="https://codepen.io/css_in_ua/pen/NWovppN">
  Untitled</a> by css.in.ua (<a href="https://codepen.io/css_in_ua">@css_in_ua</a>)
  on <a href="https://codepen.io">CodePen</a>.

У цьому прикладі демонструється базове використання методу String.prototype.includes(). Ми перевіряємо, чи міститься підстрока в основному рядку. Це особливо корисно для простих перевірок наявності тексту, наприклад, в умовних конструкціях.

// Створюємо рядок
let message = "Вітаємо в JavaScript світі!";

// Перевіряємо, чи містить рядок слово "JavaScript"
let containsJavaScript = message.includes("JavaScript");

console.log(containsJavaScript); // Виводить: true

У цьому прикладі використовується String.prototype.includes() для фільтрації масиву рядків. Ми шукаємо всі рядки, що містять певне слово, і збираємо їх у новий масив. Цей підхід демонструє більш складне та практичне застосування методу у комбінації з іншими структурами даних.

// Масив рядків
let sentences = [
    "JavaScript це весело.",
    "Вивчаємо програмування.",
    "JavaScript робить веб-сайти інтерактивними."
];

// Фільтруємо масив, залишаючи тільки рядки, які містять "JavaScript"
let javaScriptSentences = sentences.filter(sentence => sentence.includes("JavaScript"));

console.log(javaScriptSentences); // Виводить: ["JavaScript це весело.", "JavaScript робить веб-сайти інтерактивними."]

JS довідник

JavaScript

Наповнення JS розділу