Что такое регулярное выражение? Регулярные выражения JavaScript за 5 минут

Регулярные выражения (называемые Regex или RegExp) — это шаблоны, которые мы можем использовать для сопоставления комбинаций символов в строках. Они используются во многих языках для обработки текста и манипуляций.

В JavaScript регулярные выражения также функционируют как объекты и представлены собственным объектом RegExp. Сформировав шаблон поиска с помощью Regex, мы можем легко искать данные и сделать нашу работу более продуктивной.

В этом кратком руководстве мы познакомим вас с Regex в JavaScript и покажем, как начать работу с этим мощным инструментом.

Сегодня мы узнаем:

Что такое регулярные выражения?
Анатомия регулярных выражений
Объект RegExp в JavaScript
Как создать регулярное выражение в JavaScript
Расширенные концепции для дальнейшего изучения

Что такое регулярные выражения?

Регулярные выражения представляют собой специально отформатированные текстовые строки для поиска шаблонов в тексте. Они обычно используются для обработки текста и манипулирования им. Регулярное выражение состоит из последовательности символов для создания шаблона поиска, который можно применять к операциям текстового поиска и замены текста.

Регулярным выражением может быть что угодно, от одного символа до сложного шаблона.

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

Вообще говоря, существует два типа регулярных выражений с одним основным отличием.

POSIX: все специальные символы должны быть экранированы (т. е. иметь префикс с символом \), чтобы их можно было распознать.
PCRE (Perl-совместимые регулярные выражения): специальные символы поддерживаются напрямую без экранирования.

JavaScript реализует разновидность стиля PCRE.

Анатомия регулярных выражений

Давайте посмотрим на различные компоненты в регулярном выражении. На изображении ниже показаны основные части RegExp.

Давайте разберем основные вещи, которые вам нужно знать.

Начальные и конечные символы. В литеральной записи они используются для обозначения ограничений регулярного выражения.
Флаг. После окончания / вашего регулярного выражения вы можете добавить несколько флагов. Это повлияет на поведение механизма RegExp, анализирующего ваше выражение.
Захват групп. Это очень полезная функция регулярных выражений, которая позволяет вам захватить часть совпадения, чтобы вы могли заменить ее чем-то другим или извлечь ее.
Группы без захвата: они позволяют сопоставить часть анализируемой строки.
Классы символов. Они определяют шаблоны для соответствия внутри каждой группы. Например, запись a-z означает любой символ от a до z.

Существует множество специальных символов, которые мы используем для создания регулярных выражений. Мы обсудим это позже.

Объект RegExp в JavaScript

В JavaScript регулярные выражения представлены собственным объектом RegExp. Существует два основных способа создания нового объекта RegExp:

Буквальный синтаксис
Конструктор RegExp()

Объект RegExp представляет экземпляр регулярного выражения.

С литеральным синтаксисом мы можем создавать регулярные выражения напрямую, используя их классическую запись. Однако здесь есть ограничения. Одно большое различие между этими подходами заключается в том, что конструктор объекта позволяет передавать выражение в кавычках. Это позволяет нам создавать динамические выражения.

В буквальном синтаксисе используется косая черта (/pattern/). В синтаксисе конструктора используются кавычки ("pattern").

Посмотрите на приведенный ниже код и увидите в первой строке, что мы можем создать только константное выражение. Однако мы можем использовать объект, чтобы воспользоваться конкатенацией строк, создав динамическое выражение.

let greeting = /[hH]ello/

let prefix = "hH"
let suffix = ""

let objGreeting = new RegExp("[" + prefix + "]ello" + suffix)
console.log(objGreeting)

//-------------------------------
let prefix1 = "bB"
let suffix1 = "w"

let objGreeting1 = new RegExp("[" + prefix1 + "]ello" + suffix1)
console.log(objGreeting1)
//output

/[hH]ello/
/[bB]ellow/

Как создать регулярное выражение в JavaScript

Теперь мы знаем, что есть два способа создания регулярных выражений в JavaScript. Давайте рассмотрим это подробнее.

Конструктор регулярных выражений:

Синтаксис: new RegExp(pattern[, flags])

Пример:

var regexConst = new RegExp('abc');

Литерал регулярного выражения

Синтаксис: /pattern/flags

Пример:

var regexLiteral = /abc/;

При использовании обоих методов результатом является объект регулярного выражения. У них будут одинаковые методы и свойства. Давайте рассмотрим еще один пример, в котором используются оба метода.

let myRegExp = /[2b|^2b]/

let myOtherRegExp = new RegExp('[2b|^2b]')

console.log(myRegExp)
console.log(myOtherRegExp)
//output

/[2b|^2b]/
/[2b|^2b]/

Методы регулярных выражений

Существует два метода проверки регулярных выражений.

RegExp.prototype.test(): чтобы проверить, было ли найдено совпадение. Он принимает строку, которую мы проверяем на соответствие регулярному выражению. Он вернет true или false, если совпадение будет найдено.
RegExp.prototype.exec(): возвращает массив со всеми совпавшими группами. Он принимает строку, которую мы проверяем на соответствие регулярному выражению.

Создание шаблонов регулярных выражений

Шаблон Regex состоит из простых символов или комбинации простых и специальных символов. Самый простой шаблон Regex просто сопоставит текст с тестовой строкой.

var regex = /hello/;
console.log(regex.test('hello world'));
//output
true

Простые шаблоны состоят из символов, которые вы хотите напрямую сопоставить. Например, шаблон /cba/ соответствует комбинациям символов только там, где находится точная последовательность 'cba'.

Мы можем сделать наши выражения более мощными или сложными с помощью специальных символов, как мы обсуждали ранее. Мы можем использовать специальные символы и символы, которые вы должны запомнить и внедрить в свой собственный код. Несколько специальных символов:

Флаги

Регулярные выражения предлагают пять необязательных флагов или модификаторов. Двумя наиболее популярными являются g для глобального поиска и i для поиска без учета регистра.

Основной синтаксис выглядит следующим образом:

new RegExp('pattern', 'flags')

Давайте рассмотрим пример с использованием синтаксиса конструктора.

var regexGlobal = new RegExp('abc','g')
console.log(regexGlobal.test('abc abc'));

var regexInsensitive = new RegExp('abc','i')
console.log(regexInsensitive.test('Abc'));
//output
true
true

Классы персонажей

Специальные символы — это символы с дополнительным значением. Это наборы персонажей с предустановленным поведением, которые вы должны запомнить.

Классы символов — это все, что вы заключаете в скобки, чтобы синтаксический анализатор знал, какие символы вы хотите сопоставить. Например, /[abc]/ соответствует первому a в строке: bbbabcdebbb.

Давайте взглянем на несколько примеров классов символов:

Диапазон символов: /[a-z]/ или /[0-5]/
Любой символ слова: /[\w]/
Пробелы: /[\s]/
Соответствие символам конца строки: /\n/

квантификаторы

Квантификаторы — это символы со специальным значением в регулярном выражении. Например, + соответствует предыдущему выражению 1 или более раз, а * соответствует предыдущему выражению 0 или более раз.

Квантификаторов не так много, но они позволяют создавать сложные шаблоны. Квантификаторы могут быть размещены рядом с одним персонажем, классом символов или группой захвата. Они также повлияют на то, как ваше регулярное выражение интерпретируется на основе этого.

Расширенные концепции для дальнейшего изучения

Теперь у вас должно быть четкое представление о том, что такое Regex в JavaScript и как их создавать. Предстоит еще многому научиться. Следующие, более продвинутые понятия, которые нужно изучить, заключаются в следующем:

Группы захвата
Метод exec
Совпадение протокола и имени хоста
Разбор с помощью регулярных выражений

Чтобы начать работу с этими концепциями и не только, ознакомьтесь с курсом Educative Регулярные выражения JavaScript в деталях.. Вы узнаете, как создавать собственные регулярные выражения, используя различные методы и специальные символы. Вы даже изучите объекты RegExp, синтаксический анализ и сопоставление паролей и шаблонов электронной почты. К концу вы станете экспертом по Regex.

Удачного обучения!

Продолжить чтение о JavaScript на Educative

Начать обсуждение

Какие советы по JavaScript вы считаете наиболее полезными? Была ли эта статья полезна? Дайте нам знать в комментариях ниже!