20 февраля 2020 г.

Якоря: начало строки ^ и конец $

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

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

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

let str1 = "Mary had a little lamb";
alert( /^Mary/.test(str1) ); // true

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

Аналогично можно проверить, кончается ли строка словом snow при помощи snow$:

let str1 = "it's fleece was white as snow";
alert( /snow$/.test(str1) ); // true

В конкретно этих случаях мы могли бы использовать и методы строк startsWith/endsWith. Регулярные выражения следует применять, когда нужна проверка сложнее.

Проверка на полное совпадение

Оба якоря вместе ^...$ часто используются для проверки, совпадает ли строка с шаблоном полностью. Например, чтобы определить, в правильном ли формате пользователь ввёл данные.

Проверим, что строка является временем в формате 12:34, то есть две цифры, затем двоеточие, затем ещё две цифры.

На языке регулярных выражений это \d\d:\d\d:

let goodInput = "12:34";
let badInput = "12:345";

let regexp = /^\d\d:\d\d$/;
alert( regexp.test(goodInput) ); // true
alert( regexp.test(badInput) ); // false

Здесь совпадение с \d\d:\d\d ищется не где-то посередине текста, а сразу после начала строки ^, и после него должен быть сразу конец строки $.

То есть, вся строка – это как раз время в нужном нам формате.

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

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

Якоря ^ и $ – это проверки. У них нулевая ширина.

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

Задачи

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

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

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

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

Карта учебника

Комментарии

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