Как сделать регулярное выражение javascript
Перейти к содержимому

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

  • автор:

Методы RegExp и String

В этой главе мы рассмотрим все детали методов для работы с регулярными выражениями.

str.match(regexp)

Метод str.match(regexp) ищет совпадения с regexp в строке str .

У него есть три режима работы:

    Если у регулярного выражения нет флага g , то он возвращает первое совпадение в виде массива со скобочными группами и свойствами index (позиция совпадения), input (строка поиска, равна str ):

let str = "I love JavaScript"; let result = str.match(/Java(Script)/); alert( result[0] ); // JavaScript (всё совпадение) alert( result[1] ); // Script (первые скобки) alert( result.length ); // 2 // Дополнительная информация: alert( result.index ); // 7 (позиция совпадения) alert( result.input ); // I love JavaScript (исходная строка)
let str = "I love JavaScript"; let result = str.match(/Java(Script)/g); alert( result[0] ); // JavaScript alert( result.length ); // 1
let str = "I love JavaScript"; let result = str.match(/HTML/); alert(result); // null alert(result.length); // Ошибка: у null нет свойства length

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

let result = str.match(regexp) || [];

str.matchAll(regexp)

Новая возможность
Эта возможность была добавлена в язык недавно. В старых браузерах может понадобиться полифил.

Метод str.matchAll(regexp) – «новый, улучшенный» вариант метода str.match .

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

У него 3 отличия от match :

  1. Он возвращает не массив, а перебираемый объект с результатами, обычный массив можно сделать при помощи Array.from .
  2. Каждое совпадение возвращается в виде массива со скобочными группами (как str.match без флага g ).
  3. Если совпадений нет, то возвращается не null , а пустой перебираемый объект.
let str = '

Hello, world!

'; let regexp = /<(.*?)>/g; let matchAll = str.matchAll(regexp); alert(matchAll); // [object RegExp String Iterator], не массив, а перебираемый объект matchAll = Array.from(matchAll); // теперь массив let firstMatch = matchAll[0]; alert( firstMatch[0] ); //

alert( firstMatch[1] ); // h1 alert( firstMatch.index ); // 0 alert( firstMatch.input ); //

Hello, world!

При переборе результатов matchAll в цикле for..of вызов Array.from , разумеется, не нужен.

str.split(regexp|substr, limit)

Разбивает строку в массив по разделителю – регулярному выражению regexp или подстроке substr.

Обычно мы используем метод split со строками, вот так:

alert('12-34-56'.split('-')) // массив [12, 34, 56]

Но мы можем разделить по регулярному выражению аналогичным образом:

alert('12, 34, 56'.split(/,\s*/)) // массив [12, 34, 56]

str.search(regexp)

Метод str.search(regexp) возвращает позицию первого совпадения с regexp в строке str или -1 , если совпадения нет.

let str = "Я люблю JavaScript!"; let regexp = /Java.+/; alert( str.search(regexp) ); // 8

Важное ограничение: str.search умеет возвращать только позицию первого совпадения.

Если нужны позиции других совпадений, то следует использовать другой метод, например, найти их все при помощи str.matchAll(regexp) .

str.replace(str|regexp, str|func)

Это универсальный метод поиска-и-замены, один из самых полезных. Этакий швейцарский армейский нож для поиска и замены в строке.

Мы можем использовать его и без регулярных выражений, для поиска-и-замены подстроки:

// заменить тире двоеточием alert('12-34-56'.replace("-", ":")) // 12:34-56

Хотя есть подводный камень.

Когда первый аргумент replace является строкой, он заменяет только первое совпадение.

Вы можете видеть это в приведённом выше примере: только первый «-» заменяется на «:» .

Чтобы найти все дефисы, нам нужно использовать не строку «-» , а регулярное выражение /-/g с обязательным флагом g :

// заменить все тире двоеточием alert( '12-34-56'.replace( /-/g, ":" )) // 12:34:56

Второй аргумент – строка замены. Мы можем использовать специальные символы в нем:

Спецсимволы Действие в строке замены
$& вставляет всё найденное совпадение
$` вставляет часть строки до совпадения
$’ вставляет часть строки после совпадения
$n если n это 1-2 значное число, то вставляет содержимое n-й скобки (см. главу Скобочные группы)
$

вставляет содержимое скобки с указанным name (см. главу Скобочные группы)
$$ вставляет «$»
let str = "John Smith"; // поменять местами имя и фамилию alert(str.replace(/(\w+) (\w+)/i, '$2, $1')) // Smith, John

Для ситуаций, которые требуют «умных» замен, вторым аргументом может быть функция.

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

Функция вызывается с аргументами func(match, p1, p2, . pn, offset, input, groups) :

  1. match – найденное совпадение,
  2. p1, p2, . pn – содержимое скобок (см. главу Скобочные группы).
  3. offset – позиция, на которой найдено совпадение,
  4. input – исходная строка,
  5. groups – объект с содержимым именованных скобок (см. главу Скобочные группы).

Если скобок в регулярном выражении нет, то будет только 3 аргумента: func(match, offset, input) .

Например, переведём выбранные совпадения в верхний регистр:

let str = "html and css"; let result = str.replace(/html|css/gi, str => str.toUpperCase()); alert(result); // HTML and CSS

Заменим каждое совпадение на его позицию в строке:

alert("Хо-Хо-хо".replace(/хо/gi, (match, offset) => offset)); // 0-3-6

В примере ниже две скобки, поэтому функция замены вызывается с 5-ю аргументами: первый – всё совпадение, затем два аргумента содержимое скобок, затем (в примере не используются) индекс совпадения и исходная строка:

let str = "John Smith"; let result = str.replace(/(\w+) (\w+)/, (match, name, surname) => `$, $`); alert(result); // Smith, John

Если в регулярном выражении много скобочных групп, то бывает удобно использовать остаточные аргументы для обращения к ним:

let str = "John Smith"; let result = str.replace(/(\w+) (\w+)/, (. match) => `$, $`); alert(result); // Smith, John

Или, если мы используем именованные группы, то объект groups с ними всегда идёт последним, так что можно получить его так:

let str = "John Smith"; let result = str.replace(/(?\w+) (?\w+)/, (. match) => < let groups = match.pop(); return `$, $`; >); alert(result); // Smith, John

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

regexp.exec(str)

Метод regexp.exec(str) ищет совпадение с regexp в строке str . В отличие от предыдущих методов, вызывается на регулярном выражении, а не на строке.

Он ведёт себя по-разному в зависимости от того, имеет ли регулярное выражение флаг g .

Если нет g , то regexp.exec(str) возвращает первое совпадение в точности как str.match(regexp) . Такое поведение не даёт нам ничего нового.

Но если есть g , то:

  • Вызов regexp.exec(str) возвращает первое совпадение и запоминает позицию после него в свойстве regexp.lastIndex .
  • Следующий такой вызов начинает поиск с позиции regexp.lastIndex , возвращает следующее совпадение и запоминает позицию после него в regexp.lastIndex .
  • …И так далее.
  • Если совпадений больше нет, то regexp.exec возвращает null , а для regexp.lastIndex устанавливается значение 0 .

Таким образом, повторные вызовы возвращают одно за другим все совпадения, используя свойство regexp.lastIndex для отслеживания текущей позиции поиска.

В прошлом, до появления метода str.matchAll в JavaScript, вызов regexp.exec использовали для получения всех совпадений с их позициями и группами скобок в цикле:

let str = 'Больше о JavaScript на https://javascript.info'; let regexp = /javascript/ig; let result; while (result = regexp.exec(str)) < alert( `Найдено $на позиции $` ); // Найдено JavaScript на позиции 9, затем // Найдено javascript на позиции 31 >

Это работает и сейчас, хотя для современных браузеров str.matchAll , как правило, удобнее.

Мы можем использовать regexp.exec для поиска совпадения, начиная с нужной позиции, если вручную поставим lastIndex .

let str = 'Hello, world!'; let regexp = /\w+/g; // без флага g свойство lastIndex игнорируется regexp.lastIndex = 5; // ищем с 5-й позиции (т.е с запятой и далее) alert( regexp.exec(str) ); // world

Если у регулярного выражения стоит флаг y , то поиск будет вестись не начиная с позиции regexp.lastIndex , а только на этой позиции (не далее в тексте).

В примере выше заменим флаг g на y . Ничего найдено не будет, поскольку именно на позиции 5 слова нет:

let str = 'Hello, world!'; let regexp = /\w+/y; regexp.lastIndex = 5; // ищем ровно на 5-й позиции alert( regexp.exec(str) ); // null

Это удобно в тех ситуациях, когда мы хотим «прочитать» что-то из строки по регулярному выражению именно на конкретной позиции, а не где-то далее.

regexp.test(str)

Метод regexp.test(str) ищет совпадение и возвращает true/false , в зависимости от того, находит ли он его.

let str = "Я люблю JavaScript"; // эти два теста делают одно и то же alert( /люблю/i.test(str) ); // true alert( str.search(/люблю/i) != -1 ); // true

Пример с отрицательным ответом:

let str = "Ля-ля-ля"; alert( /люблю/i.test(str) ); // false alert( str.search(/люблю/i) != -1 ); // false

Если регулярное выражение имеет флаг g , то regexp.test ищет, начиная с regexp.lastIndex и обновляет это свойство, аналогично regexp.exec .

Таким образом, мы можем использовать его для поиска с заданной позиции:

let regexp = /люблю/gi; let str = "Я люблю JavaScript"; // начать поиск с 10-й позиции: regexp.lastIndex = 10; alert( regexp.test(str) ); // false (совпадений нет)

Одно и то же регулярное выражение, использованное повторно на другом тексте, может дать другой результат

Если мы применяем одно и то же регулярное выражение последовательно к разным строкам, это может привести к неверному результату, поскольку вызов regexp.test обновляет свойство regexp.lastIndex , поэтому поиск в новой строке может начаться с ненулевой позиции.

Например, здесь мы дважды вызываем regexp.test для одного и того же текста, и второй раз поиск завершается уже неудачно:

let regexp = /javascript/g; // (regexp только что создан: regexp.lastIndex=0) alert( regexp.test("javascript") ); // true (теперь regexp.lastIndex=10) alert( regexp.test("javascript") ); // false

Это именно потому, что во втором тесте regexp.lastIndex не равен нулю.

Чтобы обойти это, можно присвоить regexp.lastIndex = 0 перед новым поиском. Или вместо методов на регулярном выражении вызывать методы строк str.match/search/. , они не используют lastIndex .

Регулярные выражения в JavaScript: это не так страшно, как вы думаете

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

Обложка поста Регулярные выражения в JavaScript: это не так страшно, как вы думаете

Регулярные выражения — тема, которой боятся многие разработчики. Между тем они требуются в большинстве вакансий уровня middle. В статье разберём основные символы и способы создания регулярных выражений в JavaScript, которые с небольшими отличиями работают и в других языках программирования.

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

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

Регулярные выражения (ещё их называют Regular Expressions, сокращённо regex или regexp, регулярки) — специальные шаблоны, которые используют для поиска и обработки текста. Для поиска в них можно задавать дополнительные команды, например игнорирование регистра.

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

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

Например, этот шаблон ищет email-адреса:

Почти во всех языках программирования есть регулярные выражения — реализация может отличаться, но основные моменты похожи. Их можно сравнить с отдельным мини-языком, который функционирует сам по себе.

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

Например, нам нужно проверить номер телефона в форме регистрации:

function validatePhoneNumber(phoneNumber) < const phoneRegex = /^(\+7|8)?(\d)$/; return phoneRegex.test(phoneNumber); > // пример использования функции let phoneNumber = "+79123456789"; if (validatePhoneNumber(phoneNumber)) < console.log("Номер телефона валиден!"); >else

В этом примере мы создали функцию validatePhoneNumber , которая принимает номер телефона в качестве аргумента и возвращает true , если номер телефона является действительным номером для России, и false в противном случае.

В регулярном выражении phoneRegex мы использовали символ ^ , чтобы указать, что номер телефона должен начинаться с «+7» или «8» (возможно, без плюса). Затем мы использовали символы \d для указания цифр и для указания количества цифр в номере телефона (10 цифр).

В примере использования мы передали строку «+79123456789» функции validatePhoneNumber и проверили результат.

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

Есть два способа создания регулярок — разберём каждый.

1. Конструктор RegExp()

Конструктор RegExp() позволяет создавать регулярные выражения на основе строки, передаваемой ему в качестве аргумента. Формат конструктора RegExp() выглядит следующим образом:

const regex = new RegExp(«pattern», «flags»);

Где «pattern» — это строка, содержащая регулярное выражение, а «flags» — дополнительные флаги, определяющие, как будет работать регулярное выражение. Например, флаг i указывает, что регулярное выражение должно игнорировать регистр символов.

Вот пример использования конструктора RegExp() для создания регулярного выражения, которое ищет все цифры в строке:

const regex = new RegExp(«\\d», «g»);

Здесь мы передаём строку \d в качестве первого аргумента, что означает «любая цифра». Флаг g указывает, что регулярное выражение должно искать все совпадения в строке.

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

2. Литералы

Литерал регулярного выражения, так же как и конструктор, состоит из двух частей. Первая часть — шаблон, который необходимо описать, он заключается в слеши (//). Вторая часть, после закрывающего слеша, — флаги, но их использование также необязательно.

Вот как он выглядит:

const regex = /pattern/flags;

Разберём на примере использования литерала для создания того же регулярного выражения, которое ищет все цифры в строке:

const regex = /\d/g;

Здесь мы используем литерал /\d/g , который означает «любая цифра» с флагом g , указывающим, что регулярное выражение должно искать все совпадения в строке.

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

Оба эти способа создания регулярных выражений в JavaScript эквивалентны друг другу — выбирайте тот, который вам удобнее.

Базовый синтаксис регулярных выражений в JavaScript

Разберём основу синтаксиса регулярных выражений в JavaScript.

Шаблоны и метасимволы

Шаблоны — набор символов, которые используют для поиска определённых сочетаний символов в тексте. Метасимволы — специальные символы, которые используют для составления шаблонов.

Вот несколько примеров шаблонов и метасимволов:

. — соответствует любому одиночному символу, кроме символа новой строки.

* — соответствует нулю или более повторениям предыдущего символа.

+ — соответствует одному или более повторениям предыдущего символа.

? — соответствует нулю или одному повторению предыдущего символа.

^ — соответствует началу строки.

$ — соответствует концу строки.

() — определяет группу символов, которые могут быть повторены.

Квантификаторы и модификаторы

Квантификаторы — метасимволы, которые определяют количество повторений предыдущего символа.

Некоторые квантификаторы:

— соответствует ровно n повторениям предыдущего символа.

— соответствует от n до m повторений предыдущего символа.

— соответствует n или более повторениям предыдущего символа.

? — делает предыдущий квантификатор ленивым, т. е. соответствует наименьшему возможному количеству повторений.

Пример использования квантификатора:

const pattern = /a/; // соответствует трём символам «a» подряд

В тексте, который будет обрабатываться с помощью этого регулярного выражения, будут найдены все вхождения трёх символов a подряд. Например, строка «baaaad» будет соответствовать шаблону, а строка «abaa» — нет.

Модификаторы — специальные флаги, которые можно добавить к регулярному выражению для изменения его поведения.

g — глобальный поиск, ищет все совпадения в строке.

i — игнорирование регистра, игнорирует различия между верхним и нижним регистром.

m — многострочный поиск, позволяет искать совпадения в нескольких строках.

Пример использования модификатора:

const pattern = /test/gi; // соответствует строкам «test» или «Test» или «TEST» глобально и без учёта регистра

Группы и обратные ссылки

Группы — последовательности символов, заключённые в скобки (), которые могут повторяться с помощью квантификаторов. Группы также позволяют использовать обратные ссылки, которые ссылаются на результат совпадения группы в регулярном выражении. Обратная ссылка обозначается символом \ и номером группы, например, \1 ссылается на первую группу.

Пример использования групп и обратных ссылок:

​​ const pattern = /(\w+)\s\1/; // соответствует повторяющейся последовательности символов, разделённой пробелом

В этом примере группа (\w+) соответствует любой последовательности символов, состоящей из буквенно-цифровых символов и подчёркивания. Затем \s соответствует пробелу, а \1 обратно ссылается на первую группу (\w+) , так что регулярное выражение соответствует только тем строкам, в которых последовательность символов повторяется через пробел.

Экранирование в регулярных выражениях

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

Для экранирования символа используется обратный слеш \ .

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

  • Поиск всех цифр в тексте.
let str = "Моя любимая цифра — 7, а у моего друга — 3."; const regex = /\d/g; // экранируем метасимвол "\d", который обозначает цифру let result = str.match(regex); console.log(result); // ["7", "3"] 
  • Замена всех пробелов на символ подчёркивания.
let str = "Это пример строки с несколькими пробелами."; const regex = /\s/g; // экранируем метасимвол "\s", который обозначает пробел let result = str.replace(regex, "_"); console.log(result); // Это_пример_строки_с_несколькими_пробелами. 
  • Замена всех точек в тексте на запятые, кроме точек, которые находятся внутри чисел.
let str = "По отчёту за 2022 год выручка составила 12.345.678 рублей."; const regex = /(? 

Как использовать регулярки с методами объекта RegExp и String

После того как базовый синтаксис и способы написания шаблонов усвоены, перейдём к использованию регулярок в работе. Для работы с регулярными выражениями в JavaScript есть несколько методов — рассмотрим каждый.

Метод test()

Метод test() проверяет, соответствует ли регулярное выражение заданной строке. Метод возвращает true, если строка соответствует регулярному выражению, и false, если не соответствует.

Пример использования метода test():

let str = "Hello, world!"; const pattern = /Hello/; if (pattern.test(str)) < console.log("String contains 'Hello'"); >else

В этом примере мы используем метод test() для проверки, содержит ли строка str подстроку «Hello». Регулярное выражение /Hello/ соответствует строке «Hello», и метод test() вернёт true.

Метод exec()

Метод exec() используется для поиска совпадений регулярного выражения в заданной строке. Метод возвращает массив, содержащий найденное совпадение и дополнительную информацию о нём.

Пример использования метода exec():

let str = "Hello, world!"; const pattern = /Hello/; let result = pattern.exec(str); console.log(result); // ["Hello", index: 0, input: "Hello, world!"] 

В этом примере мы используем метод exec() для поиска совпадений регулярного выражения /Hello/ в строке str. Метод exec() возвращает массив, содержащий найденное совпадение «Hello», индекс первого символа совпадения в исходной строке и саму исходную строку.

Метод match()

Метод match() используется для поиска всех совпадений регулярного выражения в заданной строке. Метод возвращает массив, содержащий все найденные совпадения.

Пример использования метода match():

let str = "The quick brown fox jumps over the lazy dog."; const pattern = /the/gi; let result = str.match(pattern); console.log(result); // ["the", "the"] 

В этом примере мы используем метод match() для поиска всех совпадений регулярного выражения /the/gi в строке str. Метод match() возвращает массив, содержащий все найденные совпадения, включая повторения.

Метод replace()

Метод replace() принимает два аргумента: регулярное выражение и строку, на которую нужно заменить найденное совпадение. Этот метод ищет все совпадения с заданным регулярным выражением в исходной строке и заменяет их на указанную строку.

Пример использования метода replace():

let str = "Привет, мир!"; const pattern = /мир/; let newstr = str.replace(pattern, "земля"); console.log(newstr); // "Привет, земля!" 

В этом примере мы используем метод replace() для замены слова «мир» на «земля» в строке «Привет, мир!» Регулярное выражение /мир/ ищет все совпадения со словом «мир» в строке, и метод replace() заменяет их на слово «земля». Результатом работы метода является новая строка «Привет, земля!»

Метод search()

Метод search() принимает один аргумент — регулярное выражение. Он ищет первое совпадение с заданным регулярным выражением в исходной строке и возвращает индекс первого символа совпадения. Если совпадение не найдено, метод возвращает -1.

let str = "Это текст для примера"; const pattern = /текст/; let index = str.search(pattern); console.log(index); // 4 

В этом примере мы используем метод search() для поиска первого совпадения со словом «текст» в строке «Это текст для примера». Регулярное выражение /текст/ ищет первое совпадение со словом «текст» в строке, и метод search() возвращает индекс первого символа этого совпадения, который равен 4.

Метод split()

Метод split() принимает один аргумент — регулярное выражение. Он разбивает исходную строку на массив подстрок, используя заданное регулярное выражение как разделитель.

Пример использования метода split():

let str = "Это текст для примера"; const pattern = / /; let words = str.split(pattern); console.log(words); // ["Это", "текст", "для", "примера"] 

В этом примере мы используем метод split() для разделения строки «Это текст для примера» на массив слов, используя регулярное выражение / / в качестве разделителя. Регулярное выражение / / ищет все пробелы в строке, и метод split() использует их в качестве разделителя для разделения строки на массив слов. Результатом работы метода является массив [«Это», «текст», «для», «примера»].

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

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

Разберём подробнее несколько вариантов использования.

Валидация email-адресов

Один из популярных примеров использования регулярных выражений — валидация email-адресов.

Шаблон будет выглядеть так:

\. — символ «.» (экранированный с помощью слеша)

Таким образом, этот паттерн соответствует любому email-адресу, который состоит из локальной части (часть до символа «@») и доменной части (часть после символа «@» и до символа «.») с верным форматом.

Для проверки email-адреса на соответствие шаблону можно использовать метод test():

function validateEmail(email) < const regex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; return regex.test(email); >console.log(validateEmail("user@example.com")); // true console.log(validateEmail("invalid@.com")); // false console.log(validateEmail("invalidemail.com")); // false 

В этом примере функция validateEmail() принимает email-адрес в качестве аргумента и использует регулярное выражение для проверки его соответствия формату. Метод test() возвращает true, если email-адрес соответствует паттерну, и false в противном случае.

Форматирование текста

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

Рассмотрим пример форматирования даты с использованием регулярных выражений.

Допустим, у нас есть дата в формате «гггг-мм-дд» (например, «2023-03-29»), а мы хотим преобразовать её в формат «дд.мм.гггг» (например, «29.03.2023»). Для этого мы можем использовать регулярное выражение, чтобы разделить дату на отдельные части, а затем использовать эти части для создания новой строки в нужном формате.

let date = "2023-03-29"; const regex = /^(\d)-(\d)-(\d)$/; let match = date.match(regex); let formattedDate = match[3] + "." + match[2] + "." + match[1]; console.log(formattedDate); // "29.03.2023" 

Давайте разберём это регулярное выражение:

(\d) — группа, соответствующая 4 цифрам (год)

(\d) — группа, соответствующая 2 цифрам (месяц)

(\d) — группа, соответствующая 2 цифрам (день)

В этом примере мы используем метод match() для поиска соответствия регулярному выражению в строке date. Если соответствие найдено, метод match() возвращает массив, содержащий соответствующие группы в порядке их появления в регулярном выражении. Затем мы используем эти группы для создания новой строки в нужном формате.

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

Извлечение номеров телефонов из строки

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

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

Допустим, у вас есть строка, содержащая несколько номеров телефонов. Вы хотите извлечь эти номера телефонов из строки и сохранить их в базе данных.

Для этого вы можете использовать следующий код:

const string = "Мой номер телефона: +7 (999) 123-45-67. Номер телефона моего друга: +7 (987) 654-32-10."; const regex = /\+\d\s?\(\d\)\s?\d-\d-\d/g; const phoneNumbers = string.match(regex); console.log(phoneNumbers); // Output: ["+7 (999) 123-45-6 7", "+7 (987) 654-32-10"] 

В этом примере мы используем регулярное выражение /\+\d\s?\(\d\)\s?\d-\d-\d/g , чтобы извлечь номера телефонов из строки string.

Регулярное выражение ищет символ «+», и за ним следует одна или несколько цифр, за которыми следует необязательный пробел. Затем идут открывающая и закрывающая скобки, за которыми следуют три цифры, после чего снова идёт необязательный пробел. Далее идут три цифры, тире, две цифры, тире и ещё две цифры. В результате, если в строке есть номер телефона в формате, соответствующем регулярному выражению, он будет извлечён и сохранён в массиве phoneNumbers.

Ещё несколько советов по использованию регулярок

  • Пишите максимально простые регулярные выражения и не усложняйте код без необходимости. Чем проще регулярное выражение, тем быстрее и эффективнее оно будет работать.
  • Тестируйте регулярные выражения перед использованием. Это позволит выявить возможные ошибки или проблемы в выражении и сделать необходимые исправления. Используйте онлайн-сервисы, такие как regex101.com, regexr.com, regexplanet.com и подобные.
  • Не злоупотребляйте использованием регулярок. Иногда другие простые методы могут оказаться более эффективными и лёгкими в понимании.
  • Используйте комментарии и форматирование кода, чтобы облегчить его чтение и обслуживание. Регулярные выражения могут быть очень сложными для понимания.
  • Используйте библиотеки. Есть множество библиотек уже готовых шаблонов — часто этого достаточно для решения задачи.

Заключение

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

Регулярные выражения в JavaScript часть 1 (replace)

Регулярные выражения в JavaScript - это мощный инструмент, который в умелых руках может творить чудеса. Знание регулярных выражений не слишком важно для создания сайтов, потому что они довольно редко встречаются в проектах. Но некоторые особо важные функции просто невозможно сделать без них. Поэтому стоит хотя бы ознакомиться с темой.

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

Типичная жизненная ситуация:
У программиста была одна проблема. Он решил эту проблему с помощью регулярного выражения. Теперь у программиста есть две проблемы!

Регулярные выражения в JavaScript лучше всего начать изучать с метода replace(X, Y). Этот метод заменяет часть строки на строку Y, используя регулярное выражение X. Попробуем продемонстрировать на примере:

var a = 'Тише, мыши, кот на крыше'; console.log( a.replace('ш', 'Ш') ); console.log( a.replace(/ш/g, 'Ш') );

Символы слеша в примере "/. /" называют ограничителями регулярных выражений в JavaScript. После ограничителя идёт модификаторы "g", который указывают на глобальный поиск. То есть поиск и замена продолжатся даже после первого удачного совпадения. Теперь запустим код и проверим результат. Получится две строки. В одной сделана только одна замена, а во второй заменены все найденные вхождения:

ТиШе, мыши, кот на крыше ТиШе, мыШи, кот на крыШе

Обратите внимание, что замена с помощью replace чувствительна к регистру. Чтобы сделать регистронезависимую замену (заменять и заглавные и строчные), можно поставить модификатор "i". Используем его вместе с модификатором "g" одновременно:

var a = 'Тише, мыши, кот на крыше'; console.log( a.replace(/Т/gi, 'М') );

Результат выполнения такого кода будет таким:

Мише, мыши, коМ на крыше

Сила регулярных выражений в том, что в искомой строке можно задавать символы-команды. Приведём пример: буквы и цифры внутри регулярного выражения будут искаться и заменяться как есть, но символ точки "." будет восприниматься как любой символ. То есть:

var a = 'Тише, мыши, кот на крыше'; console.log( a.replace(/м.ш./gi, 'МЫШИ') ); console.log( a.replace(/к. е/gi, 'сыре') );

Получим результат:

Тише, МЫШИ, кот на крыше Тише, мыши, кот на сыре

Операторы повторения

  • + - символ повторяется один или более раз
  • * - символ повторяется ноль или более раз
  • ? - символ повторяется ноль или один раз. То есть может присутствовать или нет
var a = 'Тише, мыши, кот на крыше'; console.log( a.replace(/Т.+и/gi, 'Осторожно') );

В результате выполнения такого кода получим:

Осторожно, кот на крыше

Ограничение жадности

Регулярное выражение захватывает максимально возможное количество символов. Поэтому результат может быть неожиданным. К примеру, предположим, что нам надо заменить в строке "Тише, мыши, кот на крыше" слово "Тише" на "Громче". Для этого используем выражение:

var a = 'Тише, мыши, кот на крыше'; console.log( a.replace(/Т.+е/, 'Громче') );

Может показаться, что выражение сработает правильно. Но по факту оно найдёт букву "Т" в начале строки и букву "е" не в конце первого слова, а в конце всей строки. Результат получится такой:

Громче

Чтобы этого не происходило, необходимо ограничить жадность регулярного выражения. Для этого необходимо после оператора повторения (звёздочки "*" или плюса "+") поставить знак вопроса "?", чтобы они перестали быть такими жадными.

var a = 'Тише, мыши, кот на крыше'; console.log( a.replace(/Т.+?е/, 'Громче') );

Теперь результат будет такой, какой мы ожидали ранее:

Громче, мыши, кот на крыше

Ограничивать жадность можно всем оператором повторения. В том числе самому "?", делая так: "??".

Группирующие круглые скобки

Как было сказано ранее, операторы повторения работают только на символ, который стоит до них. Если же необходимо применить оператор повторения на несколько символов, то необходимо поставить скобки. Приведём пример:

var a = 'Тише, мыши, кот на крыше'; console.log( a.replace(/(ыш)+/g, '!') );

Из кода видно, что оператор повторения будет применяться к двум символам, стоящим в круглых скобках - (ыш). Результат выполнения такого кода:

Тише, м!и, кот на кр!е

Квадратные скобки

Существуют квадратные скобки. Если круглые являются "группирующими", или в терминах логики они делают соединение "и", то квадратные скобки - это логическое "или". Приведём пример:

var a = 'Тише, мыши, кот на крыше'; console.log( a.replace(/[ншр]+/g, '!') );

В результате выполнения этого кода все буквы "н", "ш", "р", которые стоят в квадратных скобках [ншр] будут заменены на восклицательный знак "!".

Ти!е, мы!и, кот !а к!ы!е

Существует ещё возможность сделать отрицание в квадратных скобках. Тогда будут заменены все символы, которые в них не попали. Это делается с помощью значка возведения в степень "^":

var a = 'Тише, мыши, кот на крыше'; console.log( a.replace(/[^ншр]+/g, '!') );

Результат такой:

!ш!ш!н!р!ш!
  • [а-я] - все строчные буквы
  • [а-д] - строчные буквы от "а" до "д": а, б, в, г, д
  • [а-яА-Я] - все строчные и заглавные буквы
  • [0-9] - все цифры
  • [4-7] - цифры: 4, 5, 6, 7
var a = 'Тише, мыши, кот на крыше'; console.log( a.replace(/н|ш|р/g, '!') );

Результат будет такой:

Ти!е, мы!и, кот !а к!ы!е

Экранировка спецсимволов

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

Не являются спецсимволами:
@ : , ' " ; - _ = < >% # ~ `& ! /

К примеру, необходимо заменить все знаки "+" в строке. Но в регулярном выражении "+" является оператором повторения. Чтобы снять с него все функции и сделать простым символом, как букву или цифру, необходимо поставить перед ним знак падающего слеша "\", чтобы получилось "\+":

var a = 'Мышь + сыр'; console.log( a.replace(/\+/g, 'плюс') );

В таком случае говорят, что знак "+" экранирован, поэтому не воспринимается как спецсимвол. Резуьтат будет таким:

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

Поиск и замена строк с применением символьных паттернов

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

  • Регулярное выражение набор символов, которые определяют шаблон используемый для проверки соответствия комбинаций символов в строках
    • Очень мощьные для поиска и/или замены тип операций
    • Найти и извлечь данные из документа
      • Извлечь изображения из HTML, извлечь исключения / ошибки из логов
      • Пароли, електронная почта, номера телефонов, интернет адреса

      Regex синтаксис

      • Регулярные выражения экстремально мощьный инструмент которым снабжены множество языков программирования
      • Регулярные выражения используют свой собственный синтаксис (одинаковый в большинстве языков) для выполнения поставленных задачь
        • Трудно запоминаемый если использовать нечасто
        • MDN Regex ссылка
        • http://www.regexr.com/
        • https://regex101.com/
        • Могут быть созданы с использованием regex литерала или функции конструктора
        • Regex литерал удобно применять для статических выражений
        • Констуктор позволяет играть выражением в зависимости от параметров
        // literal syntax const literalRegex = /e$/g; 
        • Следующее выражение будет соответствовать 'Веб программирование', 'Весенний'
        // function constructor syntax const constructorRegex = new RegExp('^В', 'g'); 

        Regex методы и свойства

        • Полный лист свойств и методов MDN
        • RegExp.test – Ищет совпадение в строке. Возвращает true или false
        • RegExp.exec - ищет все совпадения в строке
          • Возвращает массив содержащий все найденные совпадения null .
          • Возвращает массив с информацией или null если совпадение не найдено
          • Возвращает новую строку
          • Возвращает массив
          • Возвращает индекс совпадения, или -1 если совпадения не обнаружено

          Флаги регулярных выржений

          • Регулярное выражение имеют необязательные флаги, которые позволяют устанавливать глобальный поиск и поиск без учета регистра
            • Эти флаги могут использоваться как по отдельности, так и совместно в одном выражении
            - g глобальное сопоставление - i - игнорирование регистра при сопоставлении - m - сопоставление по нескольким строкам; символы начала и конца (^ и $) начинают работать по нескольким строкам (то есть, происходит сопоставление с началом или концом каждой строки (строки разделяются символами \n или \r), а не только с началом или концом всей вводимой строки) - y - «липкий» поиск; сопоставление в целевой строке начинается с индекса, на который указывает свойство lastIndex этого регулярного выражения (и не пытается сопоставиться с любого более позднего индекса).

            Используем Regex in JavaScript

            Учесть все совпадения c упоминаниями о Курс веб-программирования
            • RegExp.test , String.match , RegExp.exec
              
            In [23]:
            var academyRegex = /Курс(ах|е)?\s(веб\s)?программировани?(я|e|ю)?/gi; var text = 'Женя изучает JavaScript На курсах веб программирования пока Саня, то же учится на курсе программированию.'; var matches = text.match(academyRegex); console.log(matches) console.log("====================== p">) var currentMatch; while(currentMatch = academyRegex.exec(text))  console.log(currentMatch); > 
                 
            [ 'курсах веб программирования', 'курсе программированию' ] ======================= [ 'курсах веб программирования', 'ах', 'веб ', 'я', index: 27, input: 'Женя изучает JavaScript На курсах веб программирования пока Саня, то же учится на курсе программированию.' ] [ 'курсе программированию', 'е', undefined, 'ю', index: 82, input: 'Женя изучает JavaScript На курсах веб программирования пока Саня, то же учится на курсе программированию.' ]

            Добавить комментарий

            Ваш адрес email не будет опубликован. Обязательные поля помечены *