Регулярные выражения javascript — шпаргалка

Введение в регулярные выражения

Регулярные выражения (RegExp) — это очень эффективный способ работы со строками.

Составив регулярное выражение с помощью специального синтаксиса вы можете:

• искать текст в строке
• заменять подстроки в строке
• извлекать информацию из строки

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

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

Регулярные выражения реализованные в UNIX, таких как grep, sed и популярных текстовых редакторах, начали набирать популярность и были добавлены в язык программирования Perl, а позже и в множество других языков.

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

Квантификаторы — * + ? и {}

abc*       соответствует строке, в которой после ab следует 0 или более символов c -> тестabc+       соответствует строке, в которой после ab следует один или более символов cabc?       соответствует строке, в которой после ab следует 0 или один символ cabc{2}     соответствует строке, в которой после ab следует 2 символа cabc{2,}    соответствует строке, в которой после ab следует 2 или более символов cabc{2,5}   соответствует строке, в которой после ab следует от 2 до 5 символов ca(bc)*     соответствует строке, в которой после ab следует 0 или более последовательностей символов bca(bc){2,5} соответствует строке, в которой после ab следует от 2 до 5 последовательностей символов bc

Используем флаги в регулярных выражениях

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

g – находятся все совпадения с указанным выражением в тексте(глобальный поиск);

i – делает поиск нечувствительным к регистру. В этом случае такие слова, как “Apple”, “aPPLe” и “apple” попадут в результаты поиска;

m – флаг включает многострочный поиск;

u – этот флаг позволит вам использовать в вашем регулярном выражении escape-последовательности кода Unicode;

y – Указывает JavaScript вести поиск соответствия в текущей позиции в целевой строке;

Флаги для регулярного выражения в JavaScript можно использовать 2 способами: либо путем добавления их в конец литерала регулярных выражений, либо путем передачи их в конструктор RegExp. Например, /cat/i, соответствующее всех вхождениям слова “cat” независимо от регистра и RegExp(«cat», ‘i’) будут работать одинаково.

Область применения регулярных выражений

В прошлом уроке мы разбирали работу со строками и там было несколько функций для поиска и извлечения искомых подстрок. Может возникнуть вопрос, а зачем придумывать что-то еще, если у нас уже есть достаточно богатый функционал для раздербанивания и анализа строк? Отвечаю, при работе с огромным количество текста, особенно, который генерируется динамически, можно проследить некоторые паттерны(повторяющиеся фрагменты и структура текста в-целом). Допустим, нам нужно выдрать из таблички все названия товаров и цены, а сколько данных будет в таблице — нам не известно. Можно в цикле использовать и, но код получится громоздким и не очень надежным. Регулярные выражения очень удобно использовать для валидации данных, например для электронной почты, номера телефона, даты и т.д.

Помните задачку из прошлого урока «Определение баланса биткойн-крана»? Там мы находили определенный тэг и из него извлекали текст, после чего получали оттуда цифру. Если мы попытались бы использовать тот же скрипт на другом кране — не факт, что он заработал бы, поскольку сведения о балансе могли находится в совершенно другом тэге с другим классом и другими атрибутами.

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

Алгоритм такой:

1. Мы получаем содержимое всей страницы в текстовом формате
2. Составляем паттерн на основе строки Balance: 145335 satoshi. Логически это выглядит примерно так
3. Ищем в тексте все совпадения с нашим паттерном и при успехе, вытаскиваем значение из 1-9 цифр.

Выглядеть это будет так:

var str = window.document.querySelector('body').textContent;
var re = /Balance:\s{0,}(\d{1,9})\s{0,}satoshi/igm;
var result = re.exec(str);

window.console.log(result); // 
window.console.log(result); // 145335 - это баланс нашего крана

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

Ретроспективная проверка

Опережающие проверки позволяют задавать условия на то, что «идёт после».

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

Синтаксис:

• Позитивная ретроспективная проверка: , ищет совпадение с при условии, что перед ним ЕСТЬ .
• Негативная ретроспективная проверка: , ищет совпадение с при условии, что перед ним НЕТ .

Чтобы протестировать ретроспективную проверку, давайте поменяем валюту на доллары США. Знак доллара обычно ставится перед суммой денег, поэтому для того чтобы найти , мы используем – число, перед которым идёт :

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

Протестируем изученный материал

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

console.log(/d/.test('12-34'));
// верно

Приведенный выше код возвращает значение true, если в строке есть хотя бы одна цифра. Что делать, если нужно проверить строку на соответствие формату? Можно использовать несколько символов «d», чтобы определить формат:

console.log(/dd-dd/.test('12-34'));
//верно
console.log(/dd-dd/.test('1234'));
//неверно

Если неважно, как в JavaScript regexp идут цифры до и после знака «—», можно использовать символ «+», чтобы показать, что шаблон «d» встречается один или несколько раз:

console.log(/d+-d+/.test('12-34'));
// верно
console.log(/d+-d+/.test('1-234'));
// верно
console.log(/d+-d+/.test('-34'));
// неверно

Для простоты можно использовать скобки, чтобы сгруппировать выражения. Допустим, у нас есть мяуканье кошки, и мы хотим проверить соответствие шаблону «meow» (мяу):

console.log(/me+(ow)+w/.test('meeeeowowoww'));
// верно

Теперь давайте разберемся.

/me+(ow)+w/

m => соответствие одной букве ‘m‘;

e + => соответствие букве «e» один или несколько раз;

(ow) + => соответствие буквам «ow» один или несколько раз;

w => соответствие букве ‘w’;

‘m’ + ‘eeee’ + ‘owowow’ + ‘w’.

Когда операторы типа «+» используются сразу после скобок, они влияют на все содержимое скобок.

Оператор «?». Он указывает, что предыдущий символ является необязательным. Как вы увидите ниже, оба тестовых примера возвращают значение true, потому что символы «s» помечены как необязательные.

console.log(/cats? says?/i.test('the Cat says meow'));
//верно
console.log(/cats? says?/i.test('the Cats say meow'));
//верно

Также выше я добавил флаг «/i». Это делает поиск нечувствительным к регистру, поэтому «cats» будут соответствовать «Cats».

Create a RegEx

There are two ways you can create a regular expression in JavaScript.

1. Using a regular expression literal:
   The regular expression consists of a pattern enclosed between slashes . For example,

   Here, is a regular expression.

2. Using the constructor function:
   You can also create a regular expression by calling the constructor function. For example,

For example,

In the above example, the string matches with the RegEx pattern . Here, the method is used to check if the string matches the pattern.

There are several other methods available to use with JavaScript RegEx. Before we explore them, let’s learn about regular expressions themselves.

If you already know the basics of RegEx, jump to .

Метод RegExp.prototype.test()

Помните, я говорил, что регулярные выражения являются объектами? Это означает, что у них есть ряд методов. Самый простой метод – это JavaScript regexp test, который возвращает логическое значение:

True (истина): строка содержит шаблон регулярного выражения.

False (ложь): совпадения не найдено.

console.log(/cat/.test(“the cat says meow”));
// верно
console.log(/cat/.test(“the dog says bark”));
// неверно

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

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

Символы

• . – (точка) соответствует любому одиночному символу за исключением переноса строки;
• * –  соответствует предыдущему выражению, которое повторяется 0 или более раз;
• + –  соответствует предыдущему выражению, которое повторяется 1 или более раз;
• ? –  предыдущее выражение является необязательным (соответствует или 1 раз);
• ^ – соответствует началу строки;
• $ – соответствует концу строки.

Группы символов

• d –  соответствует любому одиночному цифровому символу.
• w –  соответствует любому символу (цифре, букве или знаку подчёркивания).
•   –  набор символов. Соответствует любому одиночному символу из набора, заданного в скобках. Также можно задавать и диапазоны символов, например,.
• +  –  соответствует символу из набора, повторяемого один или более раз.
•   –  внутри набора символов «^» используется как знак отрицания. В данном примере шаблону соответствует всё, что не является буквами в верхнем регистре.

Флаги

В JavaScript regexp существует пять необязательных флагов. Они могут использоваться отдельно или вместе, и размещаются после закрывающего слеша. Например: //g. Здесь я приведу только два флага.

g –  глобальный поиск.

i  –  поиск, нечувствительный к регистру.

Дополнительные конструкции

(x)  –   захватывающие скобки. Это выражение соответствует x и запоминает это соответствие, поэтому им можно воспользоваться позже.

(?:x)  –  незахватывающие скобки. Выражение соответствует x, но не запоминает это соответствие.

Соответствует x, только если за ним следует y.

Жадность

Это не совсем особенность, скорее фича, но все же достойная отдельного абзаца.

Все регулярные выражения в javascript – жадные. То есть, выражение старается отхватить как можно больший кусок строки.

Например, мы хотим заменить все открывающие тэги

На что и почему – не так важно

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

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

Последний символ точка-звёздочка не захватывает, т.к. иначе не будет совпадения.

Как вариант решения используют квадратные скобки: :

Это работает. Но самым удобным вариантом является переключение точки-звёздочки в нежадный режим. Это осуществляется простым добавлением знака «» после звёздочки.

В нежадном режиме точка-звёздочка пустит поиск дальше сразу, как только нашла совпадение:

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

В javascript это сделать нельзя… Вот такая особенность. А вопросительный знак после звёздочки рулит – честное слово.

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

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

В Javascript регулярные выражения также являются объектами. Это шаблоны, использующиеся для сопоставления последовательностей символов в строках. Они используются в методах exec() и test() объекта RegExp, а также в методах match(), replace(), search и split() объекта String.

Пример

var pattern = /example/i

/example/i – это регулярное выражение. example – это шаблон (который будет использоваться в поиске). i – это модификатор, указывающий на чувствительность к регистру.

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

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

/* Квантификатор - Значение */* - 0 или более совпадений с предшествующим выражением.+ - 1 или более совпадений с предшествующим выражением.? - Предшествующее выражение необязательно (то есть совпадений 0 или 1).x{n} - "n" должно быть целым положительным числом. Количество вхождений предшествующего выражения "x" равно "n".x{n, } - "n" должно быть целым положительным числом. Количество вхождений предшествующего выражения "x" равно, как минимум, "n".x{n, m} - "n" может быть равно 0 или целому положительному числу. "m" - целое положительное число. Если "m" > "n", количество вхождений предшествующего выражения "x" равно минимум "n" и максимум "m".

Примеры:

// * - 0 или более совпадений с предшествующим выражениемconst myPattern = /bo*k/console.log(myPattern.test('b'))// falseconsole.log(myPattern.test('bk'))// trueconsole.log(myPattern.test('bok'))// true// + - 1 или более совпадений с предшествующим выражениемconst myPattern = /\d+/console.log(myPattern.test('word'))// falseconsole.log(myPattern.test(13))// true// ? - Предшествующее выражение необязательно, совпадений 0 или 1const myPattern = /foo?bar/console.log(myPattern.test('foobar'))// trueconsole.log(myPattern.test('fooobar'))// false// x{n} - Количество вхождений предшествующего выражения "x" равно "n"const myPattern = /bo{2}m/console.log(myPattern.test('bom'))// falseconsole.log(myPattern.test('boom'))// trueconsole.log(myPattern.test('booom'))// false// x{n, } - Количество вхождений предшествующего выражения "x" равно, как минимум, "n"const myPattern = /do{2,}r/console.log(myPattern.test('dor'))// falseconsole.log(myPattern.test('door'))// trueconsole.log(myPattern.test('dooor'))// true// x{n, m} - Количество вхождений предшествующего выражения "x" равно минимум "n" и максимум "m"const myPattern = /zo{1,3}m/console.log(myPattern.test('zom'))// falseconsole.log(myPattern.test('zoom'))// trueconsole.log(myPattern.test('zooom'))// trueconsole.log(myPattern.test('zoooom'))// false

Сложно, по полезно

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

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

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

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

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

Точка и перенос строки

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

И javascript здесь не исключение.

Попробуем же сделать поиск и замену многострочного вхождения. Скажем, будем заменять на тэг подчёркивания: :

Попробуйте запустить. Заменяет? Как бы не так!

Дело в том, что в javascript мультилайн режим (флаг ) влияет только на символы ^ и $, которые начинают матчиться с началом и концом строки, а не всего текста.

Точка по-прежнему – любой символ, кроме новой строки. В javascript нет флага, который устанавливает мультилайн-режим для точки. Для того, чтобы заматчить совсем что угодно – используйте .

Работающий вариант:

Поиск совпадений: метод exec

Метод возвращает массив и ставит свойства регулярного выражения.
Если совпадений нет, то возвращается null.

Например,

// Найти одну d, за которой следует 1 или более b, за которыми одна d
// Запомнить найденные b и следующую за ними d
// Регистронезависимый поиск
var myRe = /d(b+)(d)/ig;
var myArray = myRe.exec("cdbBdbsbz");

В результате выполнения скрипта будут такие результаты:

Объект	Свойство/Индекс	Описания	Пример
		Содержимое .
	Индекс совпадения (от 0)
	Исходная строка.
	Последние совпавшие символы
	Совпадения во вложенных скобках, если есть. Число вложенных скобок не ограничено.
		Индекс, с которого начинать следующий поиск.
	Показывает, что был включен регистронезависимый поиск, флаг «».
	Показывает, что был включен флаг «» поиска совпадений.
	Показывает, был ли включен флаг многострочного поиска «».
	Текст паттерна.

Если в регулярном выражении включен флаг «», Вы можете вызывать метод много раз для поиска последовательных совпадений в той же строке. Когда Вы это делаете, поиск начинается на подстроке , с индекса . Например, вот такой скрипт:

var myRe = /ab*/g;
var str = "abbcdefabh";
while ((myArray = myRe.exec(str)) != null) {
	var msg = "Found " + myArray + ".  ";
	msg += "Next match starts at " + myRe.lastIndex;
	print(msg);
}

Этот скрипт выведет следующий текст:

Found abb. Next match starts at 3
Found ab. Next match starts at 9

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

Предполагается, что все зарегистрированные имена находятся в массиве А:

var A = ;

function lookup(input)
{
  var firstName = /\w+/i.exec(input);
  if (!firstName)
  {
    print(input + " isn't a name!");
    return;
  }

  var count = 0;
  for (var i = 0; i < A.length; i++)
  {
    if (firstName.toLowerCase() == A.toLowerCase())
      count++;
  }
  var midstring = (count == 1) ? " other has " : " others have ";
  print("Thanks, " + count + midstring + "the same name!")
}

Полезные методы работы с регулярными выражениями в JavaScript

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

Вот некоторые методы, связанные с регулярными выражениями.

► test() – проверяет, содержит ли основная строка подстроку, которая соответствует шаблону, заданному данным регулярным выражением. При успешном совпадении метод возвращает true, в противном случае — false.

JavaScript

	var textA = 'I like APPles very much';
	var textB = 'I like APPles';
	var regexOne = /apples$/i 
	// вернет false
	console.log(regexOne.test(textA)); 
	// вернет true
	console.log(regexOne.test(textB));

В приведённом выше примере приведено регулярное выражение, предназначенное для поиска слова “apples” в случае, если оно расположено в конце строки. Поэтому в первом случае метод вернет false.

► search() – проверяет, содержит ли основная строка подстроку, которая соответствует шаблону, заданному данным регулярным выражением. Метод возвращает индекс совпадения при успехе и -1 в противном случае.

JavaScript

	var textA = 'I like APPles very much';
	var regexOne = /apples/;
	var regexTwo = /apples/i; 
	// Результат: -1
	console.log(textA.search(regexOne)); 
	// Результат: 7
	console.log(textA.search(regexTwo));

В данном примере проверка по превому регулярному выражению вернет -1, потому что не указан флаг нечувствительности к регистру.

► match() – осуществляет поиск подстроки в основной строке. Подстрока должна соответствовать шаблону, заданному данным регулярным выражением. Если используется флаг g, то несколько совпадений будут возвращены в виде массива.

JavaScript

	var textA = 'All I see here are apples, APPles and apPleS';
	var regexOne = /apples/gi;
	 
	// Результат: 
	console.log(textA.match(regexOne));

► exec() – производит поиск подстроки в основной строке. В случае, если подстрока соответствует шаблону, заданному данным регулярным выражением, возвращает массив с результатами или null. В свойстве input хранится оригинальная строка

JavaScript

	var textA = 'Do you like apples?';
	var regexOne = /apples/; 
	// Результат: apples
	console.log(regexOne.exec(textA));
	 
	// Результат : Do you like apples?
	console.log(regexOne.exec(textA).input);

► replace() – ищет подстроку, соответствующую заданному шаблону и заменяет ее на предоставленную заменяющую строку.

JavaScript

	var textA = 'Do you like aPPles?';
	var regexOne = /apples/i
	 
	// Результат: Do you like mangoes?
	console.log(textA.replace(regexOne, 'mangoes'));

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

JavaScript

	var textA = 'This 593 string will be brok294en at places where d1gits are.';
	var regexOne = /\d+/g
	 
	// Результат :  
	console.log(textA.split(regexOne))

Замена: str.replace

Метод заменяет совпадения с в строке на (все, если есть флаг , иначе только первое).

Например:

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

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

Пример с :

Metacharacters

Metacharacters are characters with a special meaning:

Metacharacter	Description
.	Find a single character, except newline or line terminator
\w	Find a word character
\W	Find a non-word character
\d	Find a digit
\D	Find a non-digit character
\s	Find a whitespace character
\S	Find a non-whitespace character
\b	Find a match at the beginning/end of a word, beginning like this: \bHI, end like this: HI\b
\B	Find a match, but not at the beginning/end of a word
\0	Find a NULL character
\n	Find a new line character
\f	Find a form feed character
\r	Find a carriage return character
\t	Find a tab character
\v	Find a vertical tab character
\xxx	Find the character specified by an octal number xxx
\xdd	Find the character specified by a hexadecimal number dd
\udddd	Find the Unicode character specified by a hexadecimal number dddd

Примеры

Разберём скобки на примерах.

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

Скобки группируют символы вместе. Так что означает , , и т.п.

Сделаем что-то более сложное – регулярное выражение, которое соответствует домену сайта.

Например:

Как видно, домен состоит из повторяющихся слов, причём после каждого, кроме последнего, стоит точка.

На языке регулярных выражений :

Поиск работает, но такому шаблону не соответствует домен с дефисом, например, , так как дефис не входит в класс .

Можно исправить это, заменим на везде, кроме как в конце: .

Итоговый шаблон:

Короткие обозначения

Для самых востребованных квантификаторов есть сокращённые формы записи:

Означает «один или более». То же самое, что и .

Например, находит числа (из одной или более цифр):

Означает «ноль или один». То же самое, что и . По сути, делает символ необязательным.

Например, шаблон найдёт после которого, возможно, следует , а затем .

Поэтому шаблон найдёт два варианта: и :

Означает «ноль или более». То же самое, что и . То есть символ может повторяться много раз или вообще отсутствовать.

Например, шаблон находит цифру и все нули за ней (их может быть много или ни одного):

Сравните это с (один или более):

Ещё примеры

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

Регулярное выражение для десятичных дробей (чисел с плавающей точкой):

В действии:

Регулярное выражение для «открывающего HTML-тега без атрибутов», например, или .

1. Самое простое:

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

2. Улучшенное:

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

Регулярное выражение для «открывающего или закрывающего HTML-тега без атрибутов»:

В начало предыдущего шаблона мы добавили необязательный слеш . Этот символ понадобилось заэкранировать, чтобы JavaScript не принял его за конец шаблона.

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

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

Например, для HTML-тегов без атрибутов, скорее всего, подошло бы и более простое регулярное выражение: . Но стандарт HTML накладывает более жёсткие ограничения на имя тега, так что более точным будет шаблон .

Подойдёт ли нам или нужно использовать ? А, может быть, нужно ещё его усложнить, добавить атрибуты?

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

Опережающая проверка

Синтаксис опережающей проверки: .

Он означает: найди при условии, что за ним следует . Вместо и здесь может быть любой шаблон.

Для целого числа, за которым идёт знак , шаблон регулярного выражения будет :

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

Если это не так, то игнорирует совпадение и продолжает поиск дальше

При поиске движок регулярных выражений, найдя , проверяет есть ли после него . Если это не так, то игнорирует совпадение и продолжает поиск дальше.

Возможны и более сложные проверки, например означает:

1. Найти .
2. Проверить, идёт ли сразу после (если нет – не подходит).
3. Проверить, идёт ли сразу после (если нет – не подходит).
4. Если обе проверки прошли – совпадение найдено.

То есть, этот шаблон означает, что мы ищем при условии, что за ним идёт и и .

Такое возможно только при условии, что шаблоны и не являются взаимно исключающими.

Например, ищет при условии, что за ним идёт пробел, и где-то впереди есть :

В нашей строке это как раз число .

Создание простого регулярного выражения и флаги

Для тестирования и написания паттернов в режиме онлайн я обычно использую сервис https://regex101.com. Выбираете там Javascript и смотрите в риалтайме, как обрабатывается текст вашей регуляркой, плюс там есть подсказки и небольшой справочник. 

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

// Стандартный метод
var re = new RegExp("паттерн", "флаги");

// Укороченная форма записи
var re = /паттерн/; // без флагов
var re = /паттерн/gmi; // с флагами gmi

Флаги — это параметры поиска, их всего несколько видов и вы можете использовать любой из них, или даже все сразу.i — ignore case, Если этот флаг есть, то регэксп ищет независимо от регистра, то есть не различает между А и а.g — global match, Если этот флаг есть, то регэксп ищет все совпадения, иначе – только первое.m — multiline, Многострочный режим.

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

var str = 'Писать ботов на iMacros+JS очень круто!';

window.console.log(/imacros/i.test(str)); // true
window.console.log(/imacros/.test(str)); // false

Замена, символы и группы

Хотя определяет, что конкретно соответствует шаблону регулярного выражения, функция (и ее аналог ) делает то, что вы ожидаете — заменяет строку, соответствующую данному шаблону, строкой шаблона, преобразуя выходные данные. Это можно сделать с первым подходящим шаблоном или с каждым шаблоном в большом блоке текста. Если вы углублялись в устройство CMS, большинство движков используют функцию замены регулярных выражений, чтобы волшебным образом преобразовать запутанную разметку в окончательную форму, которую может понять любой браузер.

Метод принимает две строки и заменяет вхождения одной строки другой.

На самом деле это не так уж полезно, как показывает приведенный выше результат. Однако если принимает регулярное выражение, появляется большая гибкость. Например, предположим, что вы просто хотите найти соответствие слову «is», а не только строковым символам «i» и «s» в последовательности. Это может быть достигнуто с помощью регулярного выражения:

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

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

Индикаторы $1, $2, $3 и т. д. хранят значения захваченных групп. В некоторых реализациях регулярных выражений их всего девять, однако в большинстве современных реализаций JavaScript вы можете использовать до 99 таких групп захвата. Таким образом, если у вас двенадцать групп захвата, то значения, которые они содержат, будут находиться в переменных $1, $2, …, $10, $11, $12 соответственно.

Дополнительно можно указать, чтобы определенные группы в скобках не считались группами захвата (что неудивительно, они известны как группы без захвата). Группы без захвата используют обозначение: . Например, в телефонном номере регулярное выражение:

В первом случае сначала проверяются внутренние скобки ($1, $2 и $3), затем движок выходит за их пределы и захватывает полное число ($4). Во втором случае захватываются только первые три выражения, четвертое игнорируется, потому что оно ничего не захватывает.

Выводы, рецепты

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

Чтобы найти только первое совпадение:

• Найти позицию первого совпадения – str.search(reg);
• Найти полное совпадение – str.match(reg);
• Проверить, есть ли совпадение – regexp.test(str);
• Найти совпадение с заданной позиции – regexp.exec(str), установите regexp.lastIndex в номер позиции.

Чтобы найти все совпадения:

• Массив совпадений – str.match(reg), регулярное выражение с флагом g;
• Получить все совпадения с полной информацией о каждом из них – regexp.exec(str) с флагом g в цикле.

Чтобы найти и заменить:

Заменить одну строку на другую или результат работы функции – str.replace(reg, str|func).

Чтобы разделить строку:

str.split(str|reg).

Кроме этого мы изучили два флага JavaScript RegExp:

• Флаг g — чтобы найти все совпадения (глобальный поиск);
• Флаг y — чтобы искать на точно заданной позиции внутри текста.

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

Пожалуйста, оставьте ваши комментарии по текущей теме материала. За комментарии, лайки, подписки, отклики, дизлайки низкий вам поклон!