Регулярний чатбот

Регулярні вирази в JavaScript

Регулярний вираз (або regex) - це послідовність символів, яку ми можемо використовувати, щоб знаходити та змінювати певні елементи в рядках тексту (англ. string). Отже, ми можемо:

• Шукати текст у рядку тексту
• Замінювати підрядки в рядку тексту
• Витягувати інформацію з рядка тексту

💡 Реалізація регулярних виразів у JavaScript є частиною стандарту ECMA-262 для цієї мови. Це означає, що нам не потрібно турбуватися про сумісність із конкретним браузером.

Як створювати регулярні вирази

У JavaScript регулярний вираз здебільшого записують у форматі /pattern/modifiers.

Ми маємо два способи створити регулярний вираз:

1. Літерал регулярного виразу:

const regex = /[a-z]/;

1. Конструктор RegExp:

const regex = new RegExp('[a-z]');

В обох випадках JavaScript створює з регулярного виразу обʼєкт. Рекомендується використовувати незмінні шаблони, надаючи перевагу літералу.

Конструктор RegExp стане в пригоді в тих випадках, коли регулярний вираз змінюватиметься або коли ми його ще не знаємо (наприклад, це вхідні дані).

🏴‍☠️ Прапорці

Регулярні вирази мають необовʼязкові «суперсили» під назвою flags, які додають нові можливості.

Деякі з найуживаніших:

• /g - глобальний пошук
• /i - без урахування регістру
• /m - багаторядковий пошук

Ось простий приклад:

const re = /home/gi;
const str = 'Home, sweet home.';
const myArray = str.match(re);
console.log(myArray);

=> // ["Home", "home"]

Символ g дає нам змогу знайти всі можливі збіги в рядку тексту. Без цього прапорця JavaScript витягнув би лише перший збіг Home.

Прапорець /i (без урахування регістру) дає нам змогу гнучко шукати шаблон. Завдяки цьому не має значення, шукаємо ми щось у UPPERCASE чи lowercase.

Коли ми використовуємо конструктор RegExp, синтаксис додавання прапорців інший.

let regex = /[a-z]/gi; // literal notation
let regex = new RegExp('[a-z]', 'gi'); // constructor with string pattern as first argument
let regex = new RegExp(/[a-z]/, 'gi'); // constructor with regular expression literal as first argument (Starting with ECMAScript 6)

Найпоширеніші функції

Коли регулярні вирази поєднують із вбудованими функціями JavaScript, ми отримуємо потужні способи опрацьовувати рядки тексту й діставати з них дані.

Ось деякі з найпоширеніших функцій, які використовують разом із регулярними виразами.

Test

Метод test() виконує пошук збігу між регулярним виразом і заданим рядком тексту. Повертає правду або неправду.

const str = 'It is difficult to test if you have a virus';
const result = /virus$/.test(str);

console.log(result);

// => true

Match

За допомогою методу match() ми отримуємо корисний масив, вміст якого залежить від наявності або відсутності знайдених збігів.

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

const funnyQuote =
  'If you see someone crying, ask if it is because of their haircut.';
const regex1 = /someone/;
const regex2 = /happy/;

funnyQuote.match(regex1);
// => ["someone", index: 11, input: "If you see someone crying, ask if it is because of their haircut.", groups: undefined]

funnyQuote.match(regex2);
// => null

Коли присутній прапорець глобального пошуку /g, замість єдиного збігу разом із корисною інформацією, як-от індекс або вхідні дані, метод повертає всі входження, показані в масиві:

const funnyQuote =
  'If you see someone crying, ask if it is because of their haircut.';

const regex3 = /if/gi;

funnyQuote.match(regex3);
// => ["If", "if"];

Replace

Метод replace() у JavaScript дає нам змогу шукати значення в заданому рядку тексту й замінювати його на потрібне нове значення.

string.replace(searchValue, newValue);

Шаблоном для пошуку заміни може бути один рядок тексту або регулярний вираз.

let string = 'I like dogs!';
let result = string.replace('dogs', 'cats');

let string = 'I would love to travel to Japan';
let result = string.replace(/Japan/g, 'Hawaii');

Крім того, на місце заміни можна застосувати функцію, щоб додатково змінити кожне значення.

let text = 'Say hello to the chatbot.';
let result = text.replace(/chatbot|hello/gi, function (word) {
  return word.toUpperCase();
});
// => "Say HELLO to the CHATBOT"

Split

Метод split() у JavaScript дає інший спосіб використовувати регулярні вирази для роботи з рядками тексту.

У такий спосіб ми використовуємо регулярний вираз, щоб розділити заданий рядок тексту за шаблоном, наприклад str.split(/[,.\s]/). Цей шаблон використовуватиметься як separator.

const str = 'hello,user.how are.you';

const result = str.split(/[,.\s]/);

console.log(result);
// => ['hello', 'user', 'how', 'are', 'you']