Регулярные выражения в JavaScript

ОБЯЗАТЕЛЬНОДЛЯ НОВИЧКОВ

Разработчику Архитектору

RegExp - поиск и обработка текста

Регулярное выражение (RegExp) — шаблон для поиска и обработки текста: проверить email, вытащить числа из строки, заменить формат даты. В JavaScript RegExp — отдельный тип данных; с ним работают методы строк и сам объект RegExp.

Связь: атрибут pattern в HTML — в основных HTML-тегах; справочник методов — в справочнике по JavaScript; валидация форм из скрипта — в валидации форм.

---

Создание и флаги

Два способа задать шаблон:

const a = /^\d{2}-\d{2}-\d{4}$/;           // литерал
const b = new RegExp('^\\d{2}-\\d{2}-\\d{4}$'); // конструктор — удобен, когда шаблон собирается из переменных

Флаг	Назначение
g	все совпадения, не только первое; меняет lastIndex
i	без учёта регистра
m	^ и $ привязаны к строке, а не ко всему тексту
s	. захватывает перевод строки
u	Unicode (суррогатные пары, \p{...})
y	«липкий» поиск с позиции lastIndex
d	в результате есть indices (диапазоны символов)

/привет/gi.test('Привет, мир'); // true

---

Основные элементы шаблона

Конструкция	Смысл
.	любой символ (кроме перевода строки, если нет s)
\d, \w, \s	цифра, «слово», пробел
\D, \W, \S	инверсии
[a-z]	один символ из набора
[^0-9]	один символ не из набора
* + ?	0+, 1+, 0 или 1
{3} {2,5} {3,}	точное и диапазонное число повторений
? после квантификатора	ленивый режим: .*?
^ $	начало и конец (строки или строки в режиме m)
|	альтернатива: cat|dog

Группы:

• (sub) — захватывающая, попадает в match[1], match[2]…
• (?:sub) — без захвата, только группировка
• (?<name>sub) — именованная группа, match.groups.name

Границы слова: \b — между «словесным» и «несловесным» символом.

---

Методы — что вызывать

У RegExp

/\d+/.test('abc123');        // true — есть ли совпадение
/\d+/g.exec('a1 b22');      // ['1', ...], при повторных вызовах — следующие

С флагом g у одного и того же объекта RegExp растёт lastIndex — при цикле while ((m = re.exec(s)) !== null) не забывайте сбрасывать re.lastIndex = 0 перед новой строкой.

У строки

'2024-05-25'.match(/(\d{4})-(\d{2})-(\d{2})/);
// ['2024-05-25', '2024', '05', '25', index: 0, groups: undefined]

'one two three'.matchAll(/\w+/g); // итератор всех совпадений

'price: 100 руб'.replace(/(\d+)/, '≈$1'); // price: ≈100 руб

'  hello  '.replace(/^\s+|\s+$/g, '');   // trim-подобная очистка

replace со вторым аргументом-функцией удобен для сложной подстановки:

'user_12_post_3'.replace(/_(\d+)_/g, (_, id) => ` #${id} `);

split с RegExp режет по шаблону:

'a,b; c'.split(/[,;]\s*/); // ['a', 'b', 'c']

---

Типичные задачи

Проверка формата

function isEmail(value) {
  return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(String(value).trim());
}

Для продакшена часто достаточно type="email" и Constraint Validation API; RegExp нужен для нестандартных правил.

Извлечение данных

const log = 'ERROR 2024-05-25 14:03:12 disk full';
const m = log.match(/^(\w+)\s+(\d{4}-\d{2}-\d{2})\s+(\d{2}:\d{2}:\d{2})\s+(.+)$/);
if (m) {
  const [, level, date, time, message] = m;
}

Замена с сохранением структуры

const masked = 'ИНН 7707083893'.replace(/\b(\d{2})\d{5}(\d{2})\b/, '$1*****$2');

---

Ошибки и ограничения

1. Слишком сложный шаблон — «ад регулярок» для email/URL; проще опереться на встроенные типы полей HTML или библиотеку валидации на сервере.
2. Глобальный RegExp в общем модуле — общий lastIndex ломает параллельные вызовы; создавайте новый /.../g на вызов или сбрасывайте lastIndex.
3. Катастрофический backtracking — вложенные квантификаторы (a+)+ на длинной строке тормозят вкладку; упрощайте шаблон или ограничивайте длину входа.
4. Не путать с парсером — JSON, XML и HTML надёжнее разбирать специализированными парсерами, а не одним большим RegExp.

---

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

Задача	Подход
Простая маска телефона, код	RegExp + test / replace
Поля формы в браузере	HTML pattern, type, затем валидация из JS
Массовая обработка логов	RegExp или разбор по разделителям
Сложный язык (SQL, код)	Парсер, не RegExp

---

Краткий итог

RegExp в JavaScript — связка шаблона, флагов и методов test / exec / match / replace. Начинайте с литерала /.../, именованных групп для читаемости и явного сброса lastIndex при флаге g. Для форм сочетайте разметку, CSS (:valid) и скриптовую валидацию.

---