Для начала разберемся, что же это такое.
Регулярное выражение - это инструкция, описывающая на специально разработанном языке (RegExp) закон "сходства" искомой строки с образцом.
Для чего это нужно? Например:
Не будем вдаваться в подробности, а посмотрим как задавать регулярные выражения. Существует два способа, в данной уроке мы рассмотрим один (создание в литеральной нотации):
где
pattern - шаблон, является основой регулярного выражения, определяющей критерии сопоставления строк. Состоит из литералов и метасимволов.
flags - флаги (модификаторы), задают дополнительные параметры сопоставления шаблона.
Пример:
Здесь [0-9a-z]+ - шаблон, буквально означающий следующее "любое количество цифр и букв 1 и более раз" (как задавать шаблон посмотрим чуть ниже).
i - флаг, означающий, что регистр символов не имеет значение.
Чтобы было понятнее о чем речь, рассмотрим пример. Предположим, что у нас есть форма, куда пользователь вводит свой e-mail и пароль. Мы хотим, чтобы при нажатии на кнопку "Зарегистрировать" осуществлялась проверка корректности ввода.
Код html-страницы будет следующим:
<html>
<head>
<title>javascript регулярные выражения</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<h2>Форма регистрации</h2>
<form name="forma12">
<label>E-mail:</label><br>
<input type="text" name="mail"><br>
<label>Password:</label><br>
<input type="password" name="pas"><br>
<input type="button" value="Зарегистрировать" onclick="prov_adress(forma12);">
</form>
</body>
</html>
Итак, что же должна сделать функция 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=/[0-9a-z_]+@[0-9a-z_]+\.[a-z]{2,5}/i;
var par_pattern=/[0-9a-z]+/i;
}
Теперь осуществляем проверку на сопоставление образцу. Для этого воспользуемся методом test объекта
RegExp:
function prov_adress(obj) {
var adr=obj.mail.value;
var par=obj.pas.value;
var adr_pattern=/[0-9a-z_]+@[0-9a-z_]+\.[a-z]{2,5}/i;
var par_pattern=/[0-9a-z]+/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=/[0-9a-z_]+@[0-9a-z_]+\.[a-z]{2,5}/i;
var par_pattern=/[0-9a-z]+/i;
var prov=adr_pattern.test(adr);
var prov1=par_pattern.test(par);
if (prov==true && prov1==true) {
alert("Вы зарегистрированы!");
}
else {
alert("Введенные данные некорректны!");
}
}
Готово, надеюсь, суть того, что мы делаем вы поняли. Но прежде, чем проверить работу нашего сценария, посмотрим,
из чего же состоят наши регулярные выражения.
Возьмем регулярное выражение для нашего пароля - /[0-9a-z]+/i:
Например, если пользователь введет в поле пароля "2", "a3b" или "leopard", то такой пароль будет считаться корректным. А если, он введет "ab&s" или "24?", то такой пароль корректным считаться не будет, т.к. он содержит спецсимволы, а мы их в регулярном выражении не разрешили.
Надеюсь теперь стало понятно как и зачем можно использовать регулярные выражения, осталось узнать принципы их составления. Собственно говоря, задача составления регулярного выражения сводится к созданию его шаблона. А шаблон, как вы помните, может состоять из литералов и метасимволов.
Начнем с самого простого - литералов:
var adr_pattern=/[0-9a-z_]+@[0-9a-z_]+\.[a-z]{2,5}/i;
Итак, мы указали, что в адресе электронной почты идут цифры, буквы и знаки подчеркивания 1 и более раз, затем следует символ @,
затем снова идут цифры, буквы и знаки подчеркивания 1 и более раз, затем идет символ точки, после которой идут буквы от 2 до 5 раз.
Примерно такой вид имеют адреса электронной почты.
Теперь, зная, что именно мы задали в образце, можно проверить работу примера:
Попробуйте ввести e-mail вида "serega@mail" и посмотрите, что будет.
Надо сказать, что составление шаблонов это своего рода искусство. К тому же, одно и то же регулярное выражение можно записать по-разному. Например, /[0-9a-z_]/ - это тоже самое, что и /\w/.
Если хотите потренироваться, то можете усовершенствовать регулярное выражение для проверки e-mail в нашем примере (оно далеко от совершенства).
А этот урок подошел к концу, мы рассмотрели основы применения регулярных выражений в javascript, а это и являлось нашей целью, а так же на сайте есть статья про регулярные выражения в php. Эта статья для тех, кто изучает уроки php.
Предыдущий урок Вернуться в раздел Следующий урок
Теперь нажмите кнопку, что бы не забыть адрес и вернуться к нам снова.
Обучение созданию сайтов → Уроки JavaScript → Урок 14. Регулярные выражения
JavaScript - Урок 14. Регулярные выражения
Тема регулярных выражений достаточно объемная и в одном уроке ее не охватить, но цель наших уроков дать Вам основные представления о языке javascript и его возможностях, поэтому и обойти стороной регулярные выражения никак нельзя.Для начала разберемся, что же это такое.
Регулярное выражение - это инструкция, описывающая на специально разработанном языке (RegExp) закон "сходства" искомой строки с образцом.
Для чего это нужно? Например:
- Для организации поиска в тексте чего-либо.
- Для замены одной части подстрок другими.
- Для проверки корректности пользовательского ввода (наверно, вы не раз сталкивались с ситуацией, когда вводили адрес своей электронной почты в какую-либо форму и получали ошибку типа "Некорректный e-mail").
Не будем вдаваться в подробности, а посмотрим как задавать регулярные выражения. Существует два способа, в данной уроке мы рассмотрим один (создание в литеральной нотации):
var p=/pattern/flags;
где
pattern - шаблон, является основой регулярного выражения, определяющей критерии сопоставления строк. Состоит из литералов и метасимволов.
flags - флаги (модификаторы), задают дополнительные параметры сопоставления шаблона.
Пример:
var par=/[0-9a-z]+/i;
Здесь [0-9a-z]+ - шаблон, буквально означающий следующее "любое количество цифр и букв 1 и более раз" (как задавать шаблон посмотрим чуть ниже).
i - флаг, означающий, что регистр символов не имеет значение.
Чтобы было понятнее о чем речь, рассмотрим пример. Предположим, что у нас есть форма, куда пользователь вводит свой e-mail и пароль. Мы хотим, чтобы при нажатии на кнопку "Зарегистрировать" осуществлялась проверка корректности ввода.
Код html-страницы будет следующим:
Нам осталось только указать в нашей функции, что делать в случае успешной (или неуспешной) проверки:
Возьмем регулярное выражение для нашего пароля - /[0-9a-z]+/i:
- /[0-9a-z]+/ - шаблон, в котором:
- 0-9 - любая цифра.
- a-z - любая строчная буква от a до z.
- [] - квадратные скобки означают, что в шаблоне может присутствовать любой из перечисленных в них литералов (в нашем случае цифры и строчные буквы)
- + - указывает, что данная часть шаблона (т.е. то, что в квадратных скобках) может повторяться один и более раз.
- i - флаг, означающий, что регистр символов не имеет значение.
Например, если пользователь введет в поле пароля "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".
- [] - такой шаблон сопоставим с любым одиночным символом, принадлежащим множеству, определенному в скобках. Множество задается перечислением или указанием диапазона. Например, шаблону /[abc]/ могут быть сопоставимы строки: "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/.
Теперь, зная, что именно мы задали в образце, можно проверить работу примера:
Форма регистрации
Надо сказать, что составление шаблонов это своего рода искусство. К тому же, одно и то же регулярное выражение можно записать по-разному. Например, /[0-9a-z_]/ - это тоже самое, что и /\w/.
Если хотите потренироваться, то можете усовершенствовать регулярное выражение для проверки e-mail в нашем примере (оно далеко от совершенства).
А этот урок подошел к концу, мы рассмотрели основы применения регулярных выражений в javascript, а это и являлось нашей целью, а так же на сайте есть статья про регулярные выражения в php. Эта статья для тех, кто изучает уроки php.
Предыдущий урок Вернуться в раздел Следующий урок
Теперь нажмите кнопку, что бы не забыть адрес и вернуться к нам снова.