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

Введение

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

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

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

Пример

var pattern = /example/i

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

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

JS регулярные выражения состоят из шаблона и модификатора. Синтаксис будет примерно следующим:

/pattern/modifiers;

Шаблон задает правило поиска. Он состоит из простых символов наподобие /abc/ либо комбинации простых и специальных символов: /abc/ или /Chapter (d+).d/ .

Таблица шаблонов

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

Таблица модификаторов

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

Используем объект регулярного выражения

Создаем объект регулярного выражения

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

Способ 1: используя литерал регулярного выражения, который состоит из шаблона, заключенного в слэши, например:

var reg = /ab+c/;

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

Способ 2: вызывая функцию-конструктор объекта RegExp , например:

var reg = new RegExp("ab+c");

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

Методы объекта регулярного выражения

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

• compile() (устарел в версии 1.5 ) – компилирует регулярное выражение;
• exec() – производит сопоставление в строке. Возвращает первое совпадение;
• test() – производит сопоставление в строке. Возвращает значение true или false ;
• toString() – возвращает строчное значение регулярного выражения.

Примеры

Применение test()

Метод test() – регулярное выражение объекта RegExp . Он производит поиск строки шаблона, и в зависимости от полученного результата возвращает значение true или false . Следующий JS регулярного выражения пример показывает, как происходит поиск в строке символа “e ”:

var patt = /e/; patt.test("Лучшие в мире вещи – бесплатны!");

Так как здесь в строке имеется “e ”, результатом данного кода будет значение true .

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

/e/.test("Лучшие в мире вещи – бесплатны!");

Применение exec()

Он производит поиск в строке по заданному правилу поиска, и возвращает найденный текст. Если совпадений найдено не было, то результатом будет null .

Посмотрим на метод в действии, на примере того же символа “e ”:

/e/.exec("Лучшие в мире вещи – бесплатны!");

Так как в строке имеется “e ”, результатом данного кода будет .e .

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

В Javascript эти выражения также можно использовать с двумя методами объекта String : search() и replace() . Они нужны для выполнения поиска и замены в тексте.

• Метод search() — использует выражение для поиска соответствия, и возвращает информацию о расположении соответствия;
• Метод replace() — возвращает модифицированную строку с замененным шаблоном.

Примеры

Применение регулярного выражения JS для осуществления чувствительного к регистру поиска фразы “w3schools ” в строке:

var str = "Visit W3Schools"; var n = str.search(/w3schools/i);

Результатом в n будет 6.

Метод search также принимает строку в качестве аргумента. Аргумент string будет преобразован в регулярное выражение:

Применение string для поиска фразы “W3schools ” в строке:

var str = "Visit W3Schools!"; var n = str.search("W3Schools");

Применение чувствительного к регистру регулярного выражения JS для замены «Microsoft » на «W3Schools » в строке:

var str = "Visit Microsoft!"; var res = str.replace(/microsoft/i, "W3Schools");

В результате мы получим: «Visit W3Schools! «.

Метод replace() также принимает строку для поиска:

var str = “Visit Microsoft!”; var res = str.replace(“Microsoft”, “W3Schools”);

Перевод статьи “Using regular expression in Javascript ” был подготовлен дружной командой проекта

Regex или регулярные выражения пугают новичков, но необходимы любому программисту. Давайте разберемся в регулярных выражениях на 5 простых примерах с JavaScript.

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

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

Совпадающие символы

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

1. Точка (.) соответствует любому символу. Если нужно искать именно точку, ее необходимо экранировать с помощью символа «\» (\.).

2. Знак вопроса (?) означает, что предыдущий символ является необязательным. Чтобы искать сам знак вопроса в строке, его также необходимо экранировать с помощью «\» (\?).

var text = "Lorem ipsum dolor sit amet, consectetur adipiscing elit lest. Donec convallis dignissim ligula, et rutrum est elat vistibulum eu."; // Подойдут оба и "elit", и "elat". Точка означает, что подойдет любой символ. var regex = /el.t/g; console.log(text.match(regex)); // "est" и "lest" одинаково подойдут. Знак вопроса делает "l" необязательной. var regex2 = /l?est/g; console.log(text.match(regex2));

var text = "Lorem ipsum dolor sit amet, consectetur adipiscing elit lest. Donec convallis dignissim ligula, et rutrum est elat vistibulum eu." ; // Подойдут оба и "elit", и "elat". Точка означает, что подойдет любой символ. var regex = /el.t/g ; console . log (text . match (regex ) ) ; // "est" и "lest" одинаково подойдут. Знак вопроса делает "l" необязательной. var regex2 = /l?est/g ; console . log (text . match (regex2 ) ) ;

Совпадение множества символов

Множество – это один или несколько символов, заключенных в скобки, например . Такое выражение будет искать в строке только этот набор символов – в данном примере только a, b или c. Можно наоборот, искать вхождения любых символов, кроме с помощью символа «^». [^ abc] будет соответствовать любому символу, который не является a, b или c. Также можно указать диапазон символов или чисел, например , .

Существуют встроенные наборы символов, упрощающие запись регулярных выражений. Их называют сокращениями или shorthand. К примеру, вместо можно написать \D. Есть сокращения и для остальных символов (включая цифры и знак подчеркивания) – \w и \W, а также для пробелов – \s и \S.

// Подойдут только "cat" и "can", но не "car". var text = "cat car can"; console.log(text.match(/ca/g)); // Пройдет все, кроме cat и can (присутствует символ ^) console.log(text.match(/ca[^tn]/g)); // Еще один пример, где пройдут только цифры text = "I would like 8 cups of coffee, please."; console.log("How many cups: " + text.match(//g)); // Более простой способ с помощью сокращения \d console.log("How many cups: " + text.match(/\d/g)); // Пройдет все, кроме цифр console.log(text.match(/\D/g));

// Подойдут только "cat" и "can", но не "car". var text = "cat car can" ; console . log (text . match (/ca/g ) ) ; // Пройдет все, кроме cat и can (присутствует символ ^) console . log (text . match (/ca[^tn]/g ) ) ; // Еще один пример, где пройдут только цифры text = "I would like 8 cups of coffee, please." ; console . log ("How many cups: " + text . match (//g ) ) ; // Более простой способ с помощью сокращения \d console . log ("How many cups: " + text . match (/\d/g ) ) ; // Пройдет все, кроме цифр console . log (text . match (/\D/g ) ) ;

Совпадающие слова

В большинстве случаев вам нужно искать целые слова, а не отдельные символы. Это делается с помощью модификаторов (+) и (—), которые повторяют символ или набор символов.

Добавление {X} задает точное количество повторений, {x, y} – диапазон (x и y — числа).

Кроме того, есть специальный шаблон \b, который соответствует границам на концах слов.

var text = "Hello people of 1974. I come from the future. In 2014 we have laser guns, hover boards and live on the moon!"; // Найдет годы. \d+ найдет один и более знаков var yearRegex = /\d+/g; console.log("Years: ", text.match(yearRegex)); // Найдет все предложения. Наши предложения начинаются с заглавной буквы, а кончаются точкой или восклицательным знаком. var sentenceRegex = /.+?(\.|!)/g; console.log("Sentences: ", text.match(sentenceRegex)); // Найдет все слова, начинающиеся на "h". Нам подойдут и заглавные и строчные, так что используем модификатор i // \b для определения границы слов. var hWords = /\bh\w+/ig; console.log("H Words: ", text.match(hWords)); // Найдет все слова от 4 до 6 символов var findWords = /\b\w{4,6}\b/g; console.log("Words between 4 and 6 chars: ", text.match(findWords)); // Найдет слова длиннее 5 символов console.log("Words 5 chars or longer: ", text.match(/\b\w{5,}\b/g)); // Найдет слова точно 6 символов длиной console.log("Words exactly 6 chars long: ", text.match(/\b\w{6}\b/g));

var text = "Hello people of 1974. I come from the future. In 2014 we have laser guns, hover boards and live on the moon!" ; // Найдет годы. \d+ найдет один и более знаков var yearRegex = /\d+/g ; console . log ("Years: " , text . match (yearRegex ) ) ; // Найдет все предложения. Наши предложения начинаются с заглавной буквы, а кончаются точкой или восклицательным знаком. var sentenceRegex = /.+?(\.|!)/g ; console . log ("Sentences: " , text . match (sentenceRegex ) ) ; // Найдет все слова, начинающиеся на "h". Нам подойдут и заглавные и строчные, так что используем модификатор i // \b для определения границы слов. var hWords = /\bh\w+/i g ; console . log ("H Words: " , text . match (hWords ) ) ; // Найдет все слова от 4 до 6 символов var findWords = /\b\w{4,6}\b/g ; console . log ("Words between 4 and 6 chars: " , text . match (findWords ) ) ; // Найдет слова длиннее 5 символов console . log ("Words 5 chars or longer: " , text . match (/\b\w{5,}\b/g ) ) ; // Найдет слова точно 6 символов длиной console . log ("Words exactly 6 chars long: " , text . match (/\b\w{6}\b/g ) ) ;

Валидация целых строк

В JavaScript такие выражения можно использовать для проверки пользовательского ввода из текстовых полей. Для валидации строк используется обычное регулярное выражение, привязанное к началу и концу фрагмента текста, использующее для этого выражения ^ (начало строки) и $ (конец строки). Эти символы гарантируют, что шаблон, который вы пишете, охватывает всю длину текста, а не только соответствует его части.

Кроме того, в этом случае мы используем метод test() объекта regex, который возвращает true или false, при проверке соответствия регулярного выражения строке.

// У нас имеется массив строк, давайте найдем ссылки..com/", "123461", "https://сайт/?s=google", "http://not a valid url", "abc http://invalid.url/" ]; var regex = /^https?:\/\/[\w\/?.&-=]+$/; var urls = ; for(var i = 0; i < strings.length; i++){ if(regex.test(strings[i])){ // Валидная ссылка urls.push(strings[i]); } } console.log("Valid URLs: ", urls);

// У нас имеется массив строк, давайте найдем ссылки. var strings = [ "https://сайт/" , "this is not a URL" , "https://google.com/" , "123461" , "https://сайт/?s=google" , "http://not a valid url" , "abc http://invalid.url/" var regex = / ^ https ? : \ / \ / [ \ w \ / ? . & -= ] + $ / ; var urls = ; for (var i = 0 ; i < strings . length ; i ++ ) { if (regex . test (strings [ i ] ) ) { urls . push (strings [ i ] ) ; console . log ("Valid URLs: " , urls ) ;

Поиск и замена

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

Регулярное выражение – это объект, описывающий символьный шаблон. Класс RegExp в JavaScript представляет регулярные выражения, а объекты классов String и RegExp определяют методы, использующие регулярные выражения для выполнения поиска по шаблону и операций поиска в тексте с заменой.

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

Создание

В JavaScript регулярные выражения представлены объектами RegExp. Объекты RegExp могут быть созданы посредством конструктора RegExp(), но чаще они создаются с помощью специального синтаксиса литералов. Cпособы создания:

// Используя литерал регулярного выражения: var re = /ab+c/;

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

// Вызывая функцию конструктор объекта RegExp var re = new RegExp("ab+c");

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

Спецсимволы в регулярном выражении

\ – Для обычных символов – делает их специальными. Например, выражение /s/ ищет просто символ ‘s’. А если поставить \ перед s, то /\s/ уже обозначает пробельный символ.

^ – Обозначает начало входных данных. Если установлен флаг многострочного поиска (“m”), то также сработает при начале новой строки.

$ – Обозначает конец входных данных. Если установлен флаг многострочного поиска, то также сработает в конце строки.

* – Обозначает повторение 0 или более раз. Например, /bo*/ найдет ‘boooo’ в “A ghost booooed” и ‘b’ в “A bird warbled”, но ничего не найдет в “A goat grunted”.

+ – Обозначает повторение 1 или более раз. Эквивалентно {1,}. Например, /a+/ найдет ‘a’ в “candy” и все ‘a’ в “caaaaaaandy”.

? – Обозначает, что элемент может как присутствовать, так и отсутствовать.

. – (Десятичная точка) обозначает любой символ, кроме перевода строки: \n \r \u2028 or \u2029. (можно использовать [\s\S] для поиска любого символа, включая переводы строк).

(x) – Находит x и запоминает. Это называется “запоминающие скобки”. Например, /(foo)/ найдет и запомнит ‘foo’ в “foo bar.” Найденная подстрока хранится в массиве-результате поиска или в предопределенных свойствах объекта RegExp: $1, …, $9.

(?:x) – Находит x, но не запоминает найденное. Это называется “незапоминающие скобки”. Найденная подстрока не сохраняется в массиве результатов и свойствах RegExp. Как и все скобки, объединяют находящееся в них в единый подпаттерн.

x(?=y) – Находит x, только если за x следует y. Например, /Jack(?=Sprat)/ найдет ‘Jack’, только если за ним следует ‘Sprat’. /Jack(?=Sprat|Frost)/ найдет ‘Jack’, только если за ним следует ‘Sprat’ или ‘Frost’. Однако, ни ‘Sprat’ ни ‘Frost’ не войдут в результат поиска.

x(?!y) – Находит x, только если за x не следует y. Например, /\d+(?!\.)/ найдет число, только если за ним не следует десятичная точка. /\d+(?!\.)/.exec(“3.141”) найдет 141, но не 3.141.

x|y – Находит x или y. Например, /green|red/ найдет ‘green’ в “green apple” и ‘red’ в “red apple.”

{n} – Положительное целое число. Находит ровно n повторений предшествующего элемента.

{n,} – Положительное целое число. Находит n и более повторений элемента.

{n,m} – Положительные целые числа. Находят от n до m повторений элемента.

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

[^xyz] – Любой символ, кроме указанных в наборе. Также можно указать промежуток. Например, [^abc] – то же самое, что [^a-c].

[\b] – Находит символ backspace.

\b – Находит границу слов (латинских).

\B – Обозначает не границу слов. Например, /\w\Bn/ найдет ‘on’ в “noonday”, а /y\B\w/ найдет ‘ye’ в “possibly yesterday.”

\cX – X – буква от A до Z. Обозначает контрольный символ в строке. Например, /\cM/ обозначает символ Ctrl-M.

\d – Находит цифру из любого алфавита.

\D – Найдет нецифровой символ (все алфавиты). [^0-9] – эквивалент для обычных цифр.

\f,\r,\n – Соответствующие спецсимволы form-feed, line-feed, перевод строки.

\s – Найдет любой пробельный символ, включая пробел, табуляцию, переводы строки и другие юникодные пробельные символы.

\S – Найдет любой символ, кроме пробельного.

\t – Символ табуляции.

\v – Символ вертикальной табуляции.

\w – Найдет любой (латинский) словесный символ, включая буквы, цифры и знак подчеркивания. Эквивалентно .

\W – Найдет любой (не латинский) словесный символ. Эквивалентно [^A-Za-z0-9_].

\0 – Найдет символ NUL.

\xhh – Найдет символ с кодом hh (2 шестнадцатиричных цифры).

\uhhhh – Найдет символ с кодом hhhh (4 шестнадцатиричных цифры).

Флаги

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

Флаг i указывает, что поиск по шаблону должен быть нечувствителен к регистру символов, а флаг g – что поиск должен быть глобальным, т.е. должны быть найдены все соответствия в строке. Флаг m выполняет поиск по шаблону в многострочном режиме. Если строковое выражение, в котором выполняется поиск, содержит символы перевода строк, то в этом режиме якорные символы ^ и $, помимо того, что они соответствуют началу и концу всего строкового выражения, также соответствуют началу и концу каждой текстовой строки. Флаги могут объединяться в любые комбинации.

Методы класса String

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

Метод search()

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

Var result = "JavaScript".search(/script/i); // 4

Если аргумент метода search() не является регулярным выражением, он сначала преобразуется путем передачи конструктору RegExp. Метод search() не поддерживает глобальный поиск и игнорирует флаг g в своем аргументе.

Метод replace()

Он выполняет операцию поиска с заменой. Он принимает в качестве первого аргумента регулярное выражение, а в качестве второго – строку замены. Метод отыскивает в строке, для которой он вызван, соответствие указанному шаблону. Если регулярное выражение содержит флаг g, метод replace() заменяет все найденные совпадения строкой замены. В противном случае он заменяет только первое найденное совпадение.

Метод match()

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

// вернет ["1", "2", "3"] var result = "1 плюс 2 равно 3".match(/\d+/g);

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

Метод split()

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

"123,456,789".split(","); // Вернет ["123","456","789"]

Метод split() может также принимать в качестве аргумента регулярное выражение. Это делает метод более мощным.

Объект RegExp

Конструктор RegExp() принимает один или два строковых аргумента и создает новый объект RegExp. Первый аргумент конструктора – это строка, содержащая тело регулярного выражения, т.е. текст, который должен находиться между символами слэша в литерале регулярного выражения. Второй аргумент RegExp() может отсутствовать. Если он указан, то определяет флаги регулярного выражения. Это должен быть один из символов g, i, m либо комбинация этих символов.

Свойства RegExp

Каждый объект RegExp имеет пять свойств:

• source – строка, доступная только для чтения, содержащая текст регулярного выражения.
• global – логическое значение, доступное только для чтения, определяющее наличие флага g в регулярном выражении.
• ignoreCase i в регулярном выражении.
• multiline – это логическое значение, доступное только для чтения, определяющее наличие флага m в регулярном выражении.
• lastIndex – это целое число, доступное для чтения и записи. Для шаблонов с флагом g это свойство содержит номер позиции в строке, с которой должен быть начат следующий поиск.

Методы RegExp

Объекты RegExp определяют два метода, выполняющие поиск по шаблону.

Метод exec()

Метод exec() выполняет регулярное выражение для указанной строки, т.е. ищет совпадение в строке. Если совпадение не найдено, метод возвращает null. Однако если соответствие найдено, он возвращает такой же массив, как массив, возвращаемый методом match() для поиска без флага g .

Нулевой элемент массива содержит строку, соответствующую регулярному выражению, а все последующие элементы – подстроки, соответствующие всем подвыражениям. В отличие от match(), метод exec() возвращает массив, структура которого не зависит от наличия в регулярном выражении флага g .

Когда метод exec() вызывается для того же регулярного выражения второй раз, он начинает поиск с символа, позиция которого указана в свойстве lastIndex. Если exec() не находит соответствия, свойство lastIndex получает значение 0.

Метод test()

Он принимает строку и возвращает true, если строка соответствует регулярному выражению:

Var pattern = /java/i; pattern.test("JavaScript"); // Вернет true

Вызов test() эквивалентен вызову exec(), возвращающему true, если exec() возвращает не null. По этой причине метод test() ведет себя так же, как метод exec() при вызове для глобального регулярного выражения: он начинает искать указанную строку с позиции, заданной свойством lastIndex, и если находит соответствие, устанавливает свойство lastIndex равным номеру позиции символа, непосредственно следующего за найденным соответствием.

Написание шаблона

Шаблон регулярного выражения состоит из обычных символов, например /abc/, или комбинаций обычных и специальных символов, например /ab*c/ или /Chapter (\d+)\.\d*/. Последний пример включает в себя скобки, которые используются как “запоминающий механизм”. Соответствие этой части шаблона запоминается для дальнейшего использования.

Использование простых шаблонов

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

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

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

Для чего это нужно? Например:

• Для организации поиска в тексте чего-либо.
• Для замены одной части подстрок другими.
• Для проверки корректности пользовательского ввода (наверно, вы не раз сталкивались с ситуацией, когда вводили адрес своей электронной почты в какую-либо форму и получали ошибку типа "Некорректный e-mail").

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

Var p=/pattern/flags;

Где
pattern - шаблон, является основой регулярного выражения, определяющей критерии сопоставления строк. Состоит из литералов и метасимволов.
flags - флаги (модификаторы), задают дополнительные параметры сопоставления шаблона.

Var par=/+/i;

Здесь + - шаблон, буквально означающий следующее "любое количество цифр и букв 1 и более раз" (как задавать шаблон посмотрим чуть ниже).

i

Чтобы было понятнее о чем речь, рассмотрим пример. Предположим, что у нас есть форма, куда пользователь вводит свой e-mail и пароль. Мы хотим, чтобы при нажатии на кнопку "Зарегистрировать" осуществлялась проверка корректности ввода.

Код html-страницы будет следующим:

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

Форма регистрации

Итак, что же должна сделать функция prov_adress() ? Для начала нам нужны две переменные, в которые мы поместим значения, введенные пользователем:

function prov_adress(obj) { var adr=obj.mail.value; var par=obj.pas.value; }

Теперь нам нужно задать образцы (регулярные выражения), с которыми мы и будем сравнивать то, что ввел пользователь. Здесь, я их просто приведу, о том, как их составлять поговорим позже:

function prov_adress(obj) { var adr=obj.mail.value; var par=obj.pas.value; var adr_pattern=/+@+\.{2,5}/i; var par_pattern=/+/i; }

Теперь осуществляем проверку на сопоставление образцу. Для этого воспользуемся методом test объекта RegExp :

function prov_adress(obj) { var adr=obj.mail.value; var par=obj.pas.value; var adr_pattern=/+@+\.{2,5}/i; var par_pattern=/+/i; var prov=adr_pattern.test(adr); var prov1=par_pattern.test(par); }

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

Нам осталось только указать в нашей функции, что делать в случае успешной (или неуспешной) проверки:

function prov_adress(obj) { var adr=obj.mail.value; var par=obj.pas.value; var adr_pattern=/+@+\.{2,5}/i; var par_pattern=/+/i; var prov=adr_pattern.test(adr); var prov1=par_pattern.test(par); if (prov==true && prov1==true) { alert("Вы зарегистрированы!"); } else { alert("Введенные данные некорректны!"); } }

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

Возьмем регулярное выражение для нашего пароля - /+/i :

• /+/ - шаблон, в котором:
  • 0-9 - любая цифра.
  
  
  • a-z - любая строчная буква от a до z.
  
  
  • - квадратные скобки означают, что в шаблоне может присутствовать любой из перечисленных в них литералов (в нашем случае цифры и строчные буквы)
  
  
  • + - указывает, что данная часть шаблона (т.е. то, что в квадратных скобках) может повторяться один и более раз.
  
  


• i - флаг, означающий, что регистр символов не имеет значение.

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

Например, если пользователь введет в поле пароля "2", "a3b" или "leopard", то такой пароль будет считаться корректным. А если, он введет "ab&s" или "24?", то такой пароль корректным считаться не будет, т.к. он содержит спецсимволы, а мы их в регулярном выражении не разрешили.

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

Начнем с самого простого - литералов:

• Каждый из таких символов представляет сам себя. Например, /abc/ - такому шаблону сопоставима только строка "abc".


• a-z - все строчные буквы от a до z. Например, /a-z/ - такому шаблону сопоставляются 26 строк: "a", "b", "c"... "z"


• A-Z - все заглавные буквы от A до Z.


• 0-9 - все цифры.

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

• * - указывает, что символ (или часть шаблона, если она заключена в квадратные скобки) может повторяться 0 и более раз. Например, /ab*c/ - означает, что строка начинается с символа a, затем может быть сколько угодно символов b, после которых следует символ c. Т.е. это могут быть, например, такие строки: "ac", "abc", "abbbbbbc" и т.д.


• + - указывает, что символ (или часть шаблона, если она заключена в квадратные скобки) может повторяться 1 и более раз. Например, /ab+c/ - означает, что строка начинается с символа a, затем может быть сколько угодно символов b (но не меньше 1), после которых следует символ c. Т.е. это могут быть, например, такие строки: "abc", "abbbbbbc" и т.д.


• . - указывает, что на этом месте может быть любой одиночный символ, кроме символа новой строки. Например, для шаблона /ab.c/ сопоставимы такие строки: "ab6c", "abxc", "ab=c" и т.д.


• ? - указывает, что символ (или часть шаблона, если она заключена в квадратные скобки) может повторяться 0 или 1 раз. Например, /ab?c/ - означает, что строка начинается с символа a, затем может быть или не быть один символ b, после которого следует символ c. Т.е. это могут быть такие строки: "ac", "abc"


• {n} - указывает, что символ (или часть шаблона, если она заключена в квадратные скобки) может повторяться ровно n раз. Например, /ab{3}c/ - означает, что строка начинается с символа a, затем идут 3 символа b, после которых следует символ c. Т.е. это будет строка "abbbc".


• {n,} - указывает, что символ (или часть шаблона, если она заключена в квадратные скобки) может повторяться n и более раз. Например, /ab{3,}c/ - означает, что строка начинается с символа a, затем идут 3 или более символов b, после которых следует символ c. Т.е. это могут быть такие строки: "abbbc", "abbbbbbbc" и т.д.


• {n, m} - указывает, что символ (или часть шаблона, если она заключена в квадратные скобки) может повторяться от n до m раз. Например, /ab{1,3}c/ - означает, что строка начинается с символа a, затем идут от 1 до 3 символов b, после которых следует символ c. Т.е. это могут быть такие строки: "abc", "abbc", "abbbc".


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


• [^] - такой шаблон сопоставим с любым одиночным символом, не принадлежащим множеству, определенному в скобках. Например, шаблону /[^abc]/ могут быть сопоставимы строки: "f", "x", "Z", но не могут быть сопоставимы строки: "a", "b", "c".


• ^ - указывает, что символы сопоставимы с началом строки. Например, шаблону /^abc/ могут быть сопоставимы строки: "abcd", "abcfh", но не могут быть сопоставимы строки: "dabc", "cbabc" и т.д.


• $ - указывает, что символы сопоставимы с концом строки. Например, шаблону /abc$/ могут быть сопоставимы строки: "dabc", "fhabc", но не могут быть сопоставимы строки: "abcd", "abccb" и т.д.


• | - указывает на несколько альтернативных шаблонов. Например, шаблону /ab|c/ будут сопоставимы строки: "ab" и "c".


• \ - служит для экранирования специальных символов, т.е. обратный слэш перед символом указывает на то, что он должен интерпретироваться как специальный. Например:
  • \d - соответствует любая цифра от 0 до 9.
  
  
  • \D - соответствует все, кроме цифры.
  
  
  • \s - соответствует пробел.
  
  
  • \S - соответствует все, кроме пробела.
  
  
  • \w - соответствует буква, цифра или знак подчеркивания.
  
  
  • \W - соответствует все, кроме буквы, цифры или знака подчеркивания.
  
  

Например, шаблону /x\d\d/ будут соответствовать строки: "x01", "x25" и т.д., но не будут соответствовать строки: "A15", "x0A"...

Также обратный слэш используется, чтобы специальный символ сделать литеральным. Например, если нам нужно найти строку "a*b", то мы зададим следующий шаблон /a\*b/.

Используя вышеперечисленные литералы и метасимволы, можно составлять какие угодно шаблоны (считай регулярные выражения). Давайте, например, посмотрим что же мы написали для шаблона e-mail в нашем примере:

Var adr_pattern=/+@+\.{2,5}/i;

Итак, мы указали, что в адресе электронной почты идут цифры, буквы и знаки подчеркивания 1 и более раз, затем следует символ @, затем снова идут цифры, буквы и знаки подчеркивания 1 и более раз, затем идет символ точки, после которой идут буквы от 2 до 5 раз. Примерно такой вид имеют адреса электронной почты.

Теперь, зная, что именно мы задали в образце, можно проверить работу примера:

Регулярные выражения - это язык, который описывает шаблоны строк, основанные на метасимволах. Метасимвол – это символ в регулярном выражении, который описывает некоторый класс символов строки, указывает на положение подстроки, указывает количество повторений или группирует символы в подстроку. Например, метасимвол \d описывает цифры, а $ обозначает конец строки. В регулярном выражении могут присутствовать и обычные символы, которые описывают самих себя. Набор и значение метасимволов в регулярных выражениях описывает стандарт PCRE, большинство возможностей которого поддерживается в JS.

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

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

• Сопоставление . Целью этой задачи будет выяснить, соответствует ли определённый текст заданному регулярному выражению.
• Поиск . С помощью регулярных выражений удобно находить соответствующие им подстроки и извлекать их из текста.
• Замена . Регулярные выражения часто помогают не только найти, но и заменить в тексте подстроку, соответствующую регулярному выражению.

В конечном счёте при помощи регулярных выражений можно, например:

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

Особенности регулярных выражений в JS. Литералы регулярных выражений

Главной особенностью регулярных выражений в JS является то, что для них существует отдельный вид литералов. Так же как строковые литералы обрамляются кавычками, литералы регулярных выражений обрамляются слешами (/). Таким образом JS-код может содержать выражения вида:

console.log(typeof /tcoder/); // object

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

var pattern = new RegExp("tcoder");

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

Символы в регулярных выражениях

Все алфавитно-цифровые символы в регулярных выражениях не являются метасимволами и описывают самих себя. Это значит, что регулярному выражению /tcoder/ будет соответствовать подстрока tcoder. В регулярных выражениях так же можно указывать не алфавитные символы, такие как: перевод строки (\n), табуляция (\t) и так далее. Все эти символы так же соответствуют сами себе. Поставленный перед алфавитным символом обратный слеш (\) сделает его метасимволом, если такой имеется. Например, алфавитный символ «d» станет метасимволом, описывающим цифры, если его предварить слешем (\d).

Классы символов

Одиночные символы в регулярных выражениях можно группировать в классы при помощи квадратных скобок. Созданному таким образом классу соответствует любой из включённых в него символов. Например, регулярному выражению // будут соответствовать буквы «t», «c», «o», «d», «e», «r».

В классах также можно задавать диапазон символов при помощи дефиса. Например, классу соответствует класс . Заметим, что некоторые метасимволы в регулярных выражениях уже описывают классы символов. Например, метасимвол \d эквивалентен классу . Заметим, что метасимволы, описывающие классы символов, также могут включаться в классы. Например, классу [\da-f] соответствуют цифры и буквы «a», «b», «d», «e», «f», то есть любой шестнадцатеричный символ.

Существует, также, возможность описать класс символов, указав символы, которые не должны в него входить. Делается это при помощи метасимвола ^. Например, классу [^\d] будет соответствовать любой символ кроме цифры.

Повторения

Теперь мы можем описать, скажем, десятичное число любой заданной длины, просто написав подряд столько метасимволов \d, сколько цифр в этом числе. Согласитесь, что такой подход не очень удобен. К тому же, мы не можем описать диапазон необходимого количества повторений. Например, мы не можем описать число из одной или двух цифр. К счастью, в регулярных выражениях существует возможность описывать диапазоны повторений при помощи метасимволов. Для этого после символа достаточно просто указать диапазон повторений в фигурных скобках. Например, регулярному выражению /tco{1, 3}der/ будут соответствовать строки «tcoder», «tcooder» и «tcooоder». Если опустить максимальное количество повторений, оставив запятую и минимальное количество повторений, то можно указать количество повторений больше заданного. Например, регулярному выражению /bo{2,}bs/ будут соответствовать строки «boobs», «booobs», «boooobs» и так далее с любым количеством букв «о» не меньше двух.

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

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

Жадные повторения

Приведённый выше синтаксис описывает максимальное количество повторений, то есть из всех возможных количеств повторений, количество которых лежит в указанном диапазоне — выбирается максимальное. Такие повторения называют жадными. Это значит, что регулярному выражению /\d+/ в строке yeah!!111 будет соответствовать подcтрока «111», а не «11» или «1», хотя метасимвол «+» описывает одно и более повторений.

Если вы хотите реализовать нежадное повторение, то есть выбирать минимальное возможное количество повторений из указанного диапазона, то просто поставьте символ «?» после диапазона повторений. Например, регулярному выражению /\d+?/ в строке «yeah!!111» будет соответствовать подстрока «1», а регулярному выражению /\d{2,}/ в той же строке будет соответствовать подстрока «11».

Стоит обратить внимание на важную особенность нежадного повторения. Рассмотрим регулярное выражение /bo{2,}?bs/ . В строке «i like big boooobs» ему будет соответствовать, как и при жадном повторении, подстрока boooobs, а не boobs, как можно было подумать. Дело в том, что регулярному выражению при одном сопоставлении не может соответствовать несколько подстрок, расположенных в разных местах строки. То есть, нашему регулярному выражению не могут соответствовать подстроки «boo» и «bs», склеенные в одну строку.

Альтернативы

В регулярных выражениях так же можно использовать альтернативы — описывать множество строк, которое соответствует либо одной, либо другой части регулярного выражения. Такие части и называются альтернативами и разделяются при помощи вертикальной черты. Например, регулярному выражению /two|twice|\2/ может соответствовать либо подстрока «two», либо подстрока «twice», либо подстрока «2». Цепочка альтернатив обрабатывается слева на право до первого совпадения и ей может соответствовать только подстрока, которую описывает только одна альтернатива. Например, регулярному выражению /java|script/ в строке «I like javascript» будет соответствовать только подстрока «java».

Группировки

Чтобы рассматривать несколько символов как единое целое при использовании диапазонов повторений, классов символов и всего прочего, достаточно просто взять их в круглые скобки. Например, регулярному выражению /true(coder)?/ будут соответствовать строки «truecoder» и «true».

Ссылки

Кроме того, что круглые скобки объединяют символы в регулярном выражении в единое целое, на соответствующею им подстроку можно ссылаться, просто указав после слеша номер левой скобки из пары обрамляющих его скобок. Скобки нумеруются с лева на право начиная с единицы. Например, в регулярном выражении /(one(two)(three))(four)/ \1 ссылается на one, \2 на «two», \3 на «three», \4 на «four». В качестве примера использования таких ссылок приведём регулярное выражение /(\d)\1/ , которому соответствуют двухзначные числа с одинаковыми цифрами. Важным ограничением использования обратных ссылок является невозможность их использования в классах, то есть, например, описать двухзначное число с различными цифрами регулярным выражением /(\d)[^\1]/ нельзя.

Незапоминающие скобки

Часто бывает необходимо просто сгруппировать символы, но нет необходимости создавать ссылку. В этом случае можно сразу после левой группирующей скобки можно написать?:. Например, в регулярном выражении /(one)(?:two)(three)/ \2 будет указывать на «three».

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

Указание позиции

В регулярных выражениях так же существуют метасимволы, которые указывают на некоторую позицию в строке. Чаще всех остальных используются символы ^, $ указывающие на начало и конец строки. Например, регулярному выражению /\..+$/ будут соответствовать расширения в названиях файлов, а регулярному выражению /^\d/ первая цифра в строке, если она есть.

Позитивная и негативная опережающие проверки

При помощи регулярных выражений так же можно описать подстроку, за которой следует или не следует подстрока, описанная другим шаблоном. Например, нам необходимо найти слово java только если за ним следует «script». Эту задачу можно решить при помощи регулярного выражения /java(?=script)/ . Если же нам нужно описать подстроку «java» за которой не следует script можно воспользоваться регулярным выражением /java(?!script)/ .

Соберём всё то, о чём мы говорили выше в одну табличку.

Символ	Значение
a|b	Соответствует либо а, либо и.
(…)	Группирующие скобки. Так же на подстроку, соотвествующую шаблону в скобках можно ссылаться.
(?:…)	Только группировка, без возможности ссылаться.
\n	Ссылка на подстроку, соответствующею n-ому шаблону.
^	Начало входных данных или начало строки.
$	Конец входных данных или конец строки.
a(?=b)	Соответствует подстроке, которую описывает шаблон a, только если за ней следует подстрока, описанная шаблоном b.
a(?!b)	Соответствует подстроке, которую описывает шаблон a, только если за ней не следует подстрока, описанная шаблоном b.

Флаги

И, наконец-то, последний элемент синтаксиса регулярных выражений. Флаги задают правила соответствия, которые относятся ко всему регулярному выражению. В отличие от всех остальных элементов, синтаксис регулярных выражений они пишутся сразу после литерала регулярного выражения, или передаются в строке в качестве второго параметра конструктору объекта RegExp .

В JavaScript существуют всего три флага регулярных выражений:

i – при указании этого флага регистр не учитывается, то есть, например, регулярному выражению \javascript\i будут соответствовать строки «javascript», «JavaScript», «JAVASCRIPT», «jAvAScript» и т.д.

m – этот флаг включает многострочный поиск. Это значит, что если в тексте есть символы перевода строк и этот флаг поставлен, то символы ^ и $ кроме начала и конца всего текста будут соответствовать так же ещё началу и концу каждой строки в тексте. Например, регулярному выражению /line$/m соответствует подстрока «line», как в строке «first line», так и в строке «one\nsecond line\ntwo».

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

Флаги можно комбинировать между собой в произвольном порядке, то есть \tcoder\mig , \tcоder\gim , \tocder\gmi и т.д., это одно и тоже. Порядок флагов так же не имеет значения, если их передавать в строке в качестве второго аргумента конструктору объекта RegExp , то есть new RegExp(«tcoder», «im») и new RegExp(«tcoder», «im») так же одно и тоже.

З.Ы.

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