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

Фронтенд разработка на языке JavaScript. -> Регулярные выражения.

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

Используются для поиска и проверки данных в тексте.

Проверка или поиск осуществляется при помощи составления шаблонов и нахождения соответствия этому шаблону.

При построении таких шаблонов используются специальные символы.

Эти символы соответствуют следующим выражениям:

  • любой символ

  • не цифра

  • не буква

  • промежуток от и до

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

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

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

В терминах регулярных выражений часто используются слова “шаблон” или “маска”.

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

Литерал представляет собой выражение вида 

«/шаблон/флаги»

Это выражение может быть присвоено переменной.

var template1 = /\D/

Создание при помощи конструктора.

var mask = new RegExp("шаблон","флаги")

В таком случае и шаблон, и флаги берутся в кавычки.

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

Основные способы использования.

  • проверка строки на соответствие шаблону;

  • разделение строки на части по шаблону;

  • преобразование строки по шаблону.

Проверка осуществляется методом test(str). Аргументом передается строка, которую нужно проверить.

Пример.

template = /1/
template.test("123")
template.test("234")
template.test("I am 21 years old")

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

\d Любая цифра

\s Пробельный символ (пробел, табуляция, разрыв строки)

\w Символ, допустимый в слове (англ. word—symbol): большая или маленькая буква, а также цифры или подчеркивание

. (точка) Любой символ (кроме разрыва строки)

\D Не цифра

\S Не пробельный символ

Например, использованный нами в качестве самого первого примера шаблон /\D/ обозначает наличие знака «\D» в строке а этот знак означает не цифра.

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

Обозначают набор символов.

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

Символы из набора проверяются по правилу «ИЛИ»

template = /[12]/

Данный пример проверит строку на наличие символов 1 или 2.

Можно указать интервал:

[1-4] символы (цифры) от «1» до «4»

[a-z] символы (буквы) от «a» до «z» (маленькие)

[A-Z] символы (буквы) от «A» до «Z» (большие)

[г-ж] символы (буквы) от «г» до «ж»

[0-9A-F] шестнадцатеричные цифры 0123456789ABCDEF

Задача:

** Открыть консоль и проверить строку на наличие email, ip адреса **

Мы можем указать НЕДОПУСТИМОСТЬ символов с помощью крышки ^.

template = /[^123]/

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

? 0 или 1 раз

+ 1 и более раз

* 0 и более раз

{2} ровно 2 повтора (число произвольное)

{2,} 2 и более повторов (число произвольное)

{2,7} от 2 до 7 повторов (числа произвольные)

\d{7} означает «семь цифр подряд»,

** Открыть консоль и проверить строку на наличие номера телефона **

https? - разрешает http и https

Квантификатор «?» относится только к ближайшему символу.

Cимволы-якоря

Указывают на определенное место в строке.

^ - начало строки

$ - конец строки.

Часто используются для создание маршрутов (масок url адресов)

Например, если нужно убедиться, что строка url начинается с символа слова user, то применим шаблон template = /^user/

Внимание! Cимвол ^ имеет двоякое значение в зависимости от того где применяется.

Если он стоит в начале группы «[^…]», то он «запрещает» символы означая НЕ или КРОМЕ.

Самостоятельно составить выражение “строка заканчивается любой цифрой”.

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

Список таких символов

^ $ [ ] ( ) { } . * + \ ? < > |\ \

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

Работу с регулярными шаблонами обеспечивают как объекты типа RegExp, так и объекты типа String.

Метод exec кроме проверки еще проводит поиск по шаблону.

Например.

str = "20% of population owning 80% income"
template = /\d+/
template.exec(str)

Возвратит объект первого вхождения.

Для того, чтобы найти последующие, применяются флаги.

template = /\d+/g

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

При наличии флага «g» метод «exec» можно вызывать несколько раз, получая новые совпадения с шаблоном. Если совпадений нет - вернет null.

Метод match

Работает схоже с exec только результат с флагом g будет разный.

При записи этого метода программная инструкция как бы «переворачивается» — метод «match» вызывается у строковой переменной (str), а в качестве аргумента ему передается регулярный шаблон (template):

str.match(template)

С флагом g возвращает список вхождений.

Метод replace

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

str="67-00-53"
str.replace("-","")

Задача: убирать черточки в поле ввода при наборе.

Внимание! replace уберет только первое вхождение, если не указан флаг g.

Убирать можем в промежутке.

str = "67 - 00 - 53"
str.replace(/[- ]/g,"")

Задание: создайте шаблон и проверьте его работоспособность для ситуации, когда в номере телефона допускаются еще и круглые скобки. Для проверки можете использовать телефон в формате «(0512) 67-00-53».

Метод split

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

str.split(",")

Задача. Используя модификатор \W разделить строки

str1 = "Smith John"
str2 = "Smith, John"

Задание: в поле ввода допускается вписывать несколько ip адресов, разделяя их запятой.

Флаг i

Регистронезависимый поиск.

template = /yes/i

Практика.

Создать форму и повесить функцию проверки на onsubmit=”return checkForm()”.

Функция при ошибке валидации вернет false, предотвратив отправку формы.

Правила формы.

  1. В имени (и фамилии) могут быть только буквы.

Заданное правило проще всего проверять «от обратного» — если в строке есть что-то, кроме букв, то проверка считается не пройденной.

function checkForm(){
    var n1 = document.getElementById("name1").value;
    var t1 = /[^a-z]/i;
    if(t1.test(n1))
    alert("First name is incorrect");
    return false;
}

  1. Первая буква имени должна быть большой.

    /^[A-Z][a-z]*$/

    function checkForm(){ var n1 = document.getElementById(“name1”).value; var t1 = /^[A-Z][a-z]*$/; if(!t1.test(n1)) alert(“First name is incorrect”); return false; }

  2. Составные имена нужно проверять каждое отдельно по шаблону «Большая буква» далее «маленькие» потом «тире» и снова «Большая», затем «маленькие».

    /^[A-Z][a-z](-[A-Z][a-z])*$/

  3. Первая буква в них может не быть большой и после нее возможен апостроф. O’Brian

    /^[A-Za-z]’?[A-Za-z][a-z]*$/