Начало строки ^ и конец $

У символов каретки '^' и доллара '$' есть специальные значения в регулярных выражениях. Они называются «якоря» (anchors).

Каретка ^ означает совпадение с началом текста, а доллар $ – с концом.

К примеру, давайте проверим начинается ли текст с Mary:

let str1 = "Mary had a little lamb, it's fleece was white as snow";
let str2 = "Everywhere Mary went, the lamp was sure to go";

alert( /^Mary/.test(str1) ); // true
alert( /^Mary/.test(str2) ); // false

Шаблон ^Mary означает: «строка начинается, затем идёт Mary».

Теперь давайте проверим, заканчивается ли текст email-ом.

Чтобы найти email, мы используем регулярное выражение [-.\w]+@([\w-]+\.)+[\w-]{2,20}.

Чтобы проверить, заканчивается ли строка email-ом, давайте добавим $ в наш шаблон.

let reg = /[-.\w]+@([\w-]+\.)+[\w-]{2,20}$/g;

let str1 = "My email is mail@site.com";
let str2 = "Everywhere Mary went, the lamp was sure to go";

alert( reg.test(str1) ); // true
alert( reg.test(str2) ); // false

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

К примеру, мы хотим проверить, что str – это цвет в виде # и 6 цифр в шестнадцатеричной системе. Шаблоном для такой записи цвета будет #[0-9a-f]{6}

Чтобы проверить, что вся строка точно подходит, мы добавим ^...$:

let str = "#abcdef";

alert( /^#[0-9a-f]{6}$/i.test(str) ); // true

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

У якорей нулевая длина

Якоря, так же как и \b – проверки. У них нулевая ширина.

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

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

Задачи

Какая строка подойдёт под шаблон ^$?

Единственной подходящей строкой будет пустая: она начинается и в тот же момент заканчивается.

Это задание ещё раз показывает, что якоря являются не символами, а тестами.

Строка "" – пустая. Движок пытается найти совпадение с ^ (начало ввода), да, оно на месте, и далее ищет совпадение с $, оно тоже на месте. То есть это полное совпадение.

MAC-адрес сетевого интерфейса состоит из 6-ти двузначных шестнадцатеричных чисел, разделённых двоеточиями.

Например: '01:32:54:67:89:AB'.

Напишите регулярное выражение, которое проверит, является ли строка MAC-адресом.

Использование:

let reg = /ваш regexp/;

alert( reg.test('01:32:54:67:89:AB') ); // true

alert( reg.test('0132546789AB') ); // false (нет двоеточий)

alert( reg.test('01:32:54:67:89') ); // false (5 чисел, должно быть 6)

alert( reg.test('01:32:54:67:89:ZZ') ) // false (ZZ в конце строки)

Двузначное шестнадцатеричное число это [0-9a-f]{2} (предполагается, что флаг i включён).

Нам нужно число NN, после которого :NN повторяется 5 раз (остальные числа).

Регулярное выражение: [0-9a-f]{2}(:[0-9a-f]{2}){5}

Теперь давайте покажем, что шаблон должен захватить весь текст (всю строку): от начала и до конца. Для этого обернём шаблон в ^...$.

Итог:

let reg = /^[0-9a-fA-F]{2}(:[0-9a-fA-F]{2}){5}$/i;

alert( reg.test('01:32:54:67:89:AB') ); // true

alert( reg.test('0132546789AB') ); // false (нет двоеточий)

alert( reg.test('01:32:54:67:89') ); // false (5 чисел, должно быть 6)

alert( reg.test('01:32:54:67:89:ZZ') ) // false (ZZ в конце строки)
Карта учебника

Комментарии

перед тем как писать…
  • Если вам кажется, что в статье что-то не так - вместо комментария напишите на GitHub.
  • Для одной строки кода используйте тег <code>, для нескольких строк кода — тег <pre>, если больше 10 строк — ссылку на песочницу (plnkr, JSBin, codepen…)
  • Если что-то непонятно в статье — пишите, что именно и с какого места.