JavaScript regexp – это тип объекта, который используется для сопоставления последовательности символов в строках.
Существует два способа создания регулярного выражения: с использованием литерала регулярного выражения или с помощью конструктора регулярных выражений. Каждый из них представляет один и тот же шаблон: символ «c », за которым следует «a », а затем символ «t ».
// литерал регулярного выражения заключается в слэши (/) var option1 = /cat/; // Конструктор регулярнго выражения var option2 = new RegExp("cat");
Как правило, если регулярное выражение остается константой, то есть не будет меняться, лучше использовать литерал регулярного выражения. Если оно будет меняться или зависит от других переменных, лучше использовать метод с конструктором.
Помните, я говорил, что регулярные выражения являются объектами? Это означает, что у них есть ряд методов. Самый простой метод – это JavaScript regexp test , который возвращает логическое значение:
True (истина ): строка содержит шаблон регулярного выражения.
False (ложь ): совпадения не найдено.
console.log(/cat/.test(“the cat says meow”)); // верно console.log(/cat/.test(“the dog says bark”)); // неверно
Секрет регулярных выражений заключается в запоминании типовых символов и групп. Я настоятельно рекомендую потратить несколько часов на таблицу, приведенную ниже, а затем вернуться, и продолжить изучение.
Флаги :
В JavaScript regexp существует пять необязательных флагов. Они могут использоваться отдельно или вместе, и размещаются после закрывающего слеша. Например: /[A —Z ]/g . Здесь я приведу только два флага.
g – глобальный поиск.
i – поиск, нечувствительный к регистру.
(x ) – захватывающие скобки. Это выражение соответствует x и запоминает это соответствие, поэтому им можно воспользоваться позже.
(?:x ) – незахватывающие скобки. Выражение соответствует x , но не запоминает это соответствие.
Соответствует x , только если за ним следует y .
Сначала протестируем все выше сказанное. Допустим, что мы хотим проверить строку на наличие любых цифр. Для этого можно использовать конструкцию «d ».
console.log(/d/.test("12-34")); // верно
Приведенный выше код возвращает значение true , если в строке есть хотя бы одна цифра. Что делать, если нужно проверить строку на соответствие формату? Можно использовать несколько символов «d », чтобы определить формат:
console.log(/dd-dd/.test("12-34")); //верно console.log(/dd-dd/.test("1234")); //неверно
Если неважно, как в JavaScript regexp online идут цифры до и после знака «— », можно использовать символ «+ », чтобы показать, что шаблон «d » встречается один или несколько раз:
console.log(/d+-d+/.test("12-34")); // верно console.log(/d+-d+/.test("1-234")); // верно console.log(/d+-d+/.test("-34")); // неверно
Для простоты можно использовать скобки, чтобы сгруппировать выражения. Допустим, у нас есть мяуканье кошки, и мы хотим проверить соответствие шаблону «meow » (мяу ):
console.log(/me+(ow)+w/.test("meeeeowowoww")); // верно
Теперь давайте разберемся.
m => соответствие одной букве ‘m ‘;
e + => соответствие букве «e» один или несколько раз;
(ow) + => соответствие буквам «ow» один или несколько раз;
w => соответствие букве ‘w ’;
‘m’ + ‘eeee’ + ‘owowow’ + ‘w’ .
Когда операторы типа «+ » используются сразу после скобок, они влияют на все содержимое скобок.
Оператор «? ». Он указывает, что предыдущий символ является необязательным. Как вы увидите ниже, оба тестовых примера возвращают значение true , потому что символы «s » помечены как необязательные.
console.log(/cats? says?/i.test("the Cat says meow")); //верно console.log(/cats? says?/i.test("the Cats say meow")); //верно
Если вы захотите найти символ слеша, нужно экранизировать его с помощью обратного слеша. То же самое верно для других символов, которые имеют особое значение, например, вопросительного знака. Вот JavaScript regexp пример того, как их искать:
var slashSearch = ///; var questionSearch = /?/;
В этом примере мы очень устали от «верблюжьего » стиля написания и нам нужен способ добавить пробелы между словами. Вот пример:
removeCc("camelCase") // => должен вернуть "camel Case"
Существует простое решение с использованием регулярного выражения. Во-первых, нам нужно найти все заглавные буквы. Это можно сделать с помощью поиска набора символов и глобального модификатора.
Это соответствует символу «C » в «camelCase »
Теперь, как добавить пробел перед «C »?
Нам нужно использовать захватывающие скобки! Они позволяют найти соответствие и запомнить его, чтобы использовать позже! Используйте захватывающие скобки, чтобы запомнить найденную заглавную букву:
Получить доступ к захваченному значению позднее можно так:
Выше мы используем $1 для доступа к захваченному значению. Кстати, если бы у нас было два набора захватывающих скобок, мы использовали бы $1 и $2 для ссылки на захваченные значения и аналогично для большего количества захватывающих скобок.
Если вам нужно использовать скобки, но не нужно фиксировать это значение, можно использовать незахватывающие скобки: (?: x ). В этом случае находится соответствие x , но оно не запоминается.
Вернемся к текущей задаче. Как мы реализуем захватывающие скобки? С помощью метода JavaScript regexp replace ! В качестве второго аргумента мы передаем «$1 ». Здесь важно использовать кавычки.
function removeCc(str){ return str.replace(/()/g, "$1"); }
Снова посмотрим на код. Мы захватываем прописную букву, а затем заменяем ее той же самой буквой. Внутри кавычек вставим пробел, за которым следует переменная $1 . В итоге получаем пробел после каждой заглавной буквы.
function removeCc(str){ return str.replace(/()/g, " $1"); } removeCc("camelCase") // "camel Case" removeCc("helloWorldItIsMe") // "hello World It Is Me"
Теперь у нас есть строка с кучей ненужных прописных букв. Вы догадались, как их удалить? Во-первых, нам нужно выбрать все заглавные буквы. Затем используем поиск набора символов с помощью глобального модификатора:
Мы снова будем использовать метод replace , но как в этот раз сделать строчной символ?
function lowerCase(str){ return str.replace(//g, ???); }
Подсказка : в методе replace () в качестве второго параметра можно указать функцию.
Мы будем использовать стрелочную функцию, чтобы не захватывать значение найденного совпадения. При использовании функции в методе JavaScript regexp replace эта функция будет вызвана после поиска совпадений, и результат функции используется в качестве замещающей строки. Еще лучше, если совпадение является глобальным и найдено несколько совпадений — функция будет вызвана для каждого найденного совпадения.
function lowerCase(str){ return str.replace(//g, (u) => u.toLowerCase()); } lowerCase("camel Case") // "camel case" lowerCase("hello World It Is Me") // "hello world it is me"
Регулярные выражения (RegExp ) - это очень эффективный способ работы со строками.
Составив регулярное выражение с помощью специального синтаксиса вы можете:
Почти во всех языках программирования есть регулярные выражения. Есть небольшие различия в реализации, но общие концепции применяются практически везде.
Регулярные выражения относятся к 1950-м годам, когда они были формализованы как концептуальный шаблон поиска для алгоритмов обработки строк.
Регулярные выражения реализованные в UNIX, таких как grep, sed и популярных текстовых редакторах, начали набирать популярность и были добавлены в язык программирования Perl, а позже и в множество других языков.
JavaScript, наряду с Perl, это один из языков программирования в котором поддержка регулярных выражений встроена непосредственно в язык.
Новичкам регулярные выражения могут показаться абсолютной ерундой, а зачастую даже и профессиональным разработчикам, если не вкладывать время необходимое для их понимания.
Регулярные выражения сложно писать , сложно читать и сложно поддерживать/изменять .
Но иногда регулярные выражения это единственный разумный способ выполнить какие-то манипуляции над строками, поэтому они являются очень ценным инструментом.
Это руководство нацелено на то чтобы самым простым способом дать вам некоторое представление о регулярных выражениях в JavaScript и предоставить информацию о том как читать и создавать регулярные выражения.
Эмпирическое правило заключается в том, что простые регулярные выражения просты для чтения и записи , в то время как сложные регулярные выражения могут быстро превратиться в беспорядок , если вы не глубоко понимаете основы.
В JavaScript регулярные выражения это объект, который может быть определён двумя способами.
Первый способ заключается в создании нового объекта RegExp с помощью конструктора:
Const re1 = new RegExp("hey")
Второй способ заключается в использовании литералов регулярных выражений :
Const re1 = /hey/
Вы знаете что в JavaScript есть литералы объектов и литералы массивов ? В нём также есть литералы regexp .
В приведённом выше примере hey называется шаблоном . В литеральной форме он находится между двумя слэшами, а в случае с конструктором объекта, нет.
Это первое важное отличие между двумя способами определения регулярных выражений, остальные мы увидим позже.
Регулярное выражение, которое мы определили выше как re1 , очень простое. Оно ищет строку hey без каки-либо ограничений: строка может содержать много текста, а слово hey находиться где-то в середине и регулярное выражение сработает. Строка может содержать только слово hey и регулярка опять сработает.
Это довольно просто.
Вы можете попробовать протестировать регулярное выражение с помощью метода RegExp.test(String) , который возвращает логическое (boolean) значение:
Re1.test("hey") // ✅ re1.test("blablabla hey blablabla") // ✅ re1.test("he") // ❌ re1.test("blablabla") // ❌
В примере выше мы просто проверили удовлетворяет ли "hey" шаблону регулярного выражения, который храниться в re1 .
Это проще простого, но вы уже знаете много о регулярных выражениях.
сработает независимо от того где находится hey внутри строки.
Если вы хотите найти строки, которые начинаются с hey , то используйте оператор ^ :
/^hey/.test("hey") // ✅ /^hey/.test("bla hey") // ❌
Если вы хотите найти строки, которые заканчиваются на hey , то используйте оператор $ :
/hey$/.test("hey") // ✅ /hey$/.test("bla hey") // ✅ /hey$/.test("hey you") // ❌
Объединяя два предыдущих оператора вы можете найти строку, которая полностью совпадает с hey:
/^hey$/.test("hey") // ✅
Чтобы найти строку начинающуюся с одной подстроки, а заканчивающуюся другой подстрокой вы можете использовать.* , который будет совпадать с любым символом повторяющимся 0 или более раз:
/^hey.*joe$/.test("hey joe") // ✅ /^hey.*joe$/.test("heyjoe") // ✅ /^hey.*joe$/.test("hey how are you joe") // ✅ /^hey.*joe$/.test("hey joe!") // ❌
Вместо того чтобы искать определённую строку, вы можете указать диапазон символов, например:
// // a, b, c, ... , x, y, z // // A, B, C, ... , X, Y, Z // // a, b, c // // 0, 1, 2, 3, ... , 8, 9
Эти регулярные выражения ищут строки, которые содержат хотя бы один символ из выбранного диапазона:
//.test("a") // ✅ //.test("1") // ❌ //.test("A") // ❌ //.test("d") // ❌ //.test("dc") // ✅
Диапазоны можно комбинировать:
// //.test("a") // ✅ //.test("1") // ✅ //.test("A") // ✅
Вы можете проверить содержит ли строка только один символ из диапазона с помощью символа - :
/^$/ /^$/.test("A") // ✅ /^$/.test("Ab") // ❌
Символ ^ в начале шаблона привязывает его к началу строки.
Использование этого символа внутри диапазона инвертирует диапазон, поэтому:
/[^A-Za-z0-9]/.test("a") // ❌ /[^A-Za-z0-9]/.test("1") // ❌ /[^A-Za-z0-9]/.test("A") // ❌ /[^A-Za-z0-9]/.test("@") // ✅
Если вы хотите выбрать одну или другую строку, используйте оператор | .
/hey|ho/.test("hey") // ✅ /hey|ho/.test("ho") // ✅
Представьте что у вас есть регулярное выражение, которое проверяет строку на то чтобы она состояла только из одной цифры:
Вы можете использовать квантификатор ? , который сделает этот символ необязательным. В нашем случае цифра должна встречаться 0 или 1 раз:
но что если мы хотим чтобы регулярное выражение срабатывало на несколько цифр?
Вы можете сделать это 4 способами, используя + , * , {n} и {n,m} .
Совпадает с одним или более (>=1) элементами:
/^\d+$/ /^\d+$/.test("12") // ✅ /^\d+$/.test("14") // ✅ /^\d+$/.test("144343") // ✅ /^\d+$/.test("") // ❌ /^\d+$/.test("1a") // ❌
Совпадает с 0 или более (>=0) элементами:
/^\d+$/ /^\d*$/.test("12") // ✅ /^\d*$/.test("14") // ✅ /^\d*$/.test("144343") // ✅ /^\d*$/.test("") // ✅ /^\d*$/.test("1a") // ❌
Совпадает точно с n количеством элементов:
/^\d{3}$/ /^\d{3}$/.test("123") // ✅ /^\d{3}$/.test("12") // ❌ /^\d{3}$/.test("1234") // ❌ /^{3}$/.test("Abc") // ✅
Совпадает с диапазоном от n до m элементов:
/^\d{3,5}$/ /^\d{3,5}$/.test("123") // ✅ /^\d{3,5}$/.test("1234") // ✅ /^\d{3,5}$/.test("12345") // ✅ /^\d{3,5}$/.test("123456") // ❌
m можно опустить и оставить второй предел без ограничений, чтобы было минимум n элементов:
/^\d{3,}$/ /^\d{3,}$/.test("12") // ❌ /^\d{3,}$/.test("123") // ✅ /^\d{3,}$/.test("12345") // ✅ /^\d{3,}$/.test("123456789") // ✅
Следующий за элементом знак? , сделает его необязательным:
/^\d{3}\w?$/ /^\d{3}\w?$/.test("123") // ✅ /^\d{3}\w?$/.test("123a") // ✅ /^\d{3}\w?$/.test("123ab") // ❌
Используя круглые скобки, вы можете создавать группы символов (...) .
Пример ниже ищет точное совпадение из 3 цифр за которым следует один или более буквенно-числовые символов:
/^(\d{3})(\w+)$/ /^(\d{3})(\w+)$/.test("123") // ❌ /^(\d{3})(\w+)$/.test("123s") // ✅ /^(\d{3})(\w+)$/.test("123something") // ✅ /^(\d{3})(\w+)$/.test("1234") // ✅
Повторяющиеся символы, которые находятся после закрывающей группу скобки, относятся ко всей группе:
/^(\d{2})+$/ /^(\d{2})+$/.test("12") // ✅ /^(\d{2})+$/.test("123") // ❌ /^(\d{2})+$/.test("1234") // ✅
До сих пор мы видели, как тестировать строки и проверять, содержат ли они определенный шаблон.
Крутая возможность регулярных выражений заключается в том, что можно захватывать определённые части строки и складывать их в массив.
Вы можете делать это с помощью групп, а точнее с помощью захвата групп .
По умолчанию, группы итак захватываются. Теперь вместо использования RegExp.test(String) , который просто возвращает логическое значение, мы будем использовать один из следующих методов:
Они абсолютно одинаковые и оба возвращают массив с проверяемой строкой в качестве первого элемента, а в остальных элементах совпадения для каждой найденной группы.
Если совпадений не найдено, то он возвращает null .
"123s".match(/^(\d{3})(\w+)$/) //Array [ "123s", "123", "123s" ] /^(\d{3})(\w+)$/.exec("123s") //Array [ "123s", "123", "s" ] "hey".match(/(hey|ho)/) //Array [ "hey", "hey" ] /(hey|ho)/.exec("hey") //Array [ "hey", "hey" ] /(hey|ho)/.exec("ha!") //null
Когда группа совпадает несколько раз, то только последнее найденное значение будет добавлено в возвращаемый массив.
"123456789".match(/(\d)+/) //Array [ "123456789", "9" ]
Захват групп можно сделать опциональным с помощью (...)? . Если ничего не будет найдено, то в возвращаемый массив будет добавлен элемент undefined:
/^(\d{3})(\s)?(\w+)$/.exec("123 s") //Array [ "123 s", "123", " ", "s" ] /^(\d{3})(\s)?(\w+)$/.exec("123s") //Array [ "123s", "123", undefined, "s" ]
Каждой найденной группе присваивается число. $1 ссылается на первый элемент, $2 на второй, и так далее. Это полезно, когда мы будет говорить о замене части строки.
Это новая возможность ES2018.
Группе можно назначить имя, а не просто слот в возвращаемом массиве:
Const re = /(?
Существует разница при использовании match и exec без групп: в первом элементе массива будет находится не полностью найденная строка, а прямое совпадение:
/hey|ho/.exec("hey") // [ "hey" ] /(hey).(ho)/.exec("hey ho") // [ "hey ho", "hey", "ho" ]
Так как по умолчанию группы являются захватываемыми, нам нужен способ игнорировать некоторые группы в возвращаемом массиве. Это возможно с помощью незахватываемых групп , которые начинаются с (?:...) .
"123s".match(/^(\d{3})(?:\s)(\w+)$/) // null "123 s".match(/^(\d{3})(?:\s)(\w+)$/) // Array [ "123 s", "123", "s" ]
Вы можете использовать следующие флаги на любых регулярных выражениях:
Флаги можно комбинировать, а также они добавляются в конец строки литерала:
/hey/ig.test("HEy") // ✅
или передаются вторым параметром в конструктор объекта RegExp:
New RegExp("hey", "ig").test("HEy") // ✅
Вы можете инспектировать свойства регулярных выражений:
Специальные символы:
Это специальные символы потому что они являются управляющими символами при составлении шаблонов регулярных выражений, поэтому если вы хотите использовать их для поиска совпадений внутри шаблона, то вам нужно экранировать их с помощью символа обратного слэша:
/^\\$/ /^\^$/ // /^\^$/.test("^") ✅ /^\$$/ // /^\$$/.test("$") ✅\b и \B позволяют определить находится ли строка в начале или конце слова:
"I saw a bear".match(/\bbear/) //Array ["bear"] "I saw a beard".match(/\bbear/) //Array ["bear"] "I saw a beard".match(/\bbear\b/) //null "cool_bear".match(/\bbear\b/) //null
Мы уже видели как нужно проверять строки на совпадение с шаблоном.
Также мы видели как можно извлекать часть строк соотвествующие шаблону в массив.
Теперь давайте рассмотрим как заменять части строки на основе шаблона.
У объекта String в JavaScript есть метод replace() , который можно использовать без регулярных выражений для одной замены в строке:
"Hello world!".replace("world", "dog") //Hello dog! "My dog is a good dog!".replace("dog", "cat") //My cat is a good dog!
Этот метод также может принимать и регулярное выражение в качестве аргумента:
"Hello world!".replace(/world/, "dog") //Hello dog!
Использование флага g - это единственный способ заменить несколько вхождений в строке на ванильном JavaScript:
"My dog is a good dog!".replace(/dog/g, "cat") //My cat is a good cat!
Группы позволяют нам делать больше причудливых вещей, менять местами части строк:
"Hello, world!".replace(/(\w+), (\w+)!/, "$2: $1!!!") // "world: Hello!!!"
Вместо строки можно использовать функцию, чтобы делать ещё более интересные вещи. В неё будет передан ряд аргументов, таких как возвращают методы String.match(RegExp) или RegExp.exec(String) , где количество аргументов зависит от количества групп:
"Hello, world!".replace(/(\w+), (\w+)!/, (matchedString, first, second) => { console.log(first); console.log(second); return `${second.toUpperCase()}: ${first}!!!` }) //"WORLD: Hello!!!"
Регулярные выражения называются жадными по умолчанию.
Что это значит?
Возьмём например это регулярное выражение:
/\$(.+)\s?/
Предполагается, что нам нужно извлечь из строки сумму в долларах:
/\$(.+)\s?/.exec("This costs $100") //0
но что если у нас есть больше слов после числа, это отвлекает
/\$(.+)\s?/.exec("This costs $100 and it is less than $200") //100 and it is less than $200
Почему? Потому что регулярное выражение после знака $ совпадает с любым символом.+ и не останавливается пока не достигнет конца строки. Затем он останавливается, потому что \s? делает конечное пространство необязательным.
Чтобы исправить это, нам нужно указать что регулярное выражение должно быть ленивым и найти наименьшее количество совпадений. Мы можем сделать это с помощью символа? после квантификатора:
/\$(.+?)\s/.exec("This costs $100 and it is less than $200") //100
Итак, символ? может означать разные вещи в зависимости от своего положения, поэтому он может быть и квантификатором и индикатором ленивого режима.
Используйет?= для поиска совпадений в строке за которой следует определённая подстрока
/Roger(?=Waters)/ /Roger(?= Waters)/.test("Roger is my dog") //false /Roger(?= Waters)/.test("Roger is my dog and Roger Waters is a famous musician") //true
Выполняет обратную операцию и находит совпадений в строке за которыми не следует определённая подстрока:
/Roger(?!Waters)/ /Roger(?! Waters)/.test("Roger is my dog") //true /Roger(?! Waters)/.test("Roger is my dog and Roger Waters is a famous musician") //false
Это новая возможность ES2018.
Опережение использует символ?= . Ретроспектива использует?<= :
/(?<=Roger) Waters/ /(?<=Roger) Waters/.test("Pink Waters is my dog") //false /(?<=Roger) Waters/.test("Roger is my dog and Roger Waters is a famous musician") //true
Инверсия ретроспективы использует?
/(?
Флаг u является обязательным при работе с Unicode строками, в частности когда может понадобится обрабатывать строки в астральных плоскостях, которые не включены в первые 1600 символов Unicode.
Например эмодзи, но и только они.
/^.$/.test("a") // ✅ /^.$/.test("?") // ❌ /^.$/u.test("?") // ✅
Поэтому, всегда используйте флаг u .
Unicode, как и обычные символы, может обрабатывать диапазоны:
//.test("a") // ✅ //.test("1") // ✅ /[?-?]/u.test("?") // ✅ /[?-?]/u.test("?") // ❌
JavaScript проверяет внутренние коды представления, поэтому? < ? < ? на самом деле \u1F436 < \u1F43A < \u1F98A . Посмотрите полный список эмодзи чтобы увидеть коды и узнать их порядок.
Как мы говорили выше, в шаблоне регулярного выражения вы можете использовать \d чтобы найти совпадение на любую цифру, \s чтобы найти совпадение на любой символ кроме пробела, \w чтобы найти совпадение на любой буквенно-числовой символ и т. д.
Экранирование свойств Unicode - это возможность ES2018, которая добавляет очень крутую функцию, расширяя эту концепцию на всех Unicode символы и добавляя \p{} и \P{} .
У любого Unicode символа есть набор свойств. Например Script определяет семейство языков, ASCII - это логическое значение равное true для ASCII символов и т.д. Вы можете положить это свойство в фигурные скобки и регулярное выражение будет проверять чтобы его значение было истинным:
/^\p{ASCII}+$/u.test("abc") // ✅ /^\p{ASCII}+$/u.test("ABC@") // ✅ /^\p{ASCII}+$/u.test("ABC?") // ❌
ASCII_Hex_Digit - это ещё одно логическое свойство, которое проверяет содержит ли строка тольк валидные шестнадцатеричные цифры:
/^\p{ASCII_Hex_Digit}+$/u.test("0123456789ABCDEF") //✅ /^\p{ASCII_Hex_Digit}+$/u.test("h")
Существует много других логических свойств, которые вы можете проверить просто добавив их имя в фигурные скобки, включая Uppercase , Lowercase , White_Space , Alphabetic , Emoji и другие:
/^\p{Lowercase}$/u.test("h") // ✅ /^\p{Uppercase}$/u.test("H") // ✅ /^\p{Emoji}+$/u.test("H") // ❌ /^\p{Emoji}+$/u.test("??") // ✅
В дополнении к этим бинарным свойствам, вы можете проверить любое свойство символа Unicode чтобы соответствовало конкретному значению. В примере ниже я проверяю, записана ли строка в греческом или латинском алфавите:
/^\p{Script=Greek}+$/u.test("ελληνικά") // ✅ /^\p{Script=Latin}+$/u.test("hey") // ✅
Предположим, что есть строка содержащая только одно число, которое нужно извлечь. /\d+/ должен сделать это:
"Test 123123329".match(/\d+/) // Array [ "123123329" ]
Простейший подход заключается в проверке безпробельных символов до и после знака @ , с помощью \S:
/(\S+)@(\S+)\.(\S+)/ /(\S+)@(\S+)\.(\S+)/.exec("[email protected]") //["[email protected]", "copesc", "gmail", "com"]
Однако, это упрощенный пример, так как под него попадает множество не валидных E-mail адресов.
Представим, что у вас есть строка, которая содержит текст заключённый в двойные кавычки и вам нужно извлечь этот текст.
Лучший способ сделать это - использовать захват групп , потому то мы знаем что наше совпадение должно начинаться и заканчиваться символом " , поэтому мы можем легко настроить шаблон, но также мы хотим удалить эти кавычки из результата.
Мы найдём то что нам нужно в result :
Const hello = "Hello "nice flower"" const result = /"([^"]*)"/.exec(hello) //Array [ "\"nice flower\"", "nice flower" ]
Например получить содержимое из тега span , допуская при этом любое количество аргументов у тега:
/
Регулярное выражение это последовательность символов, которые формируют шаблон поиска .
Когда вам нужно что-то найти в каком-то тексте, то для описания того, что вы ищите, и используется шаблон поиска.
В качестве регулярного выражения может использоваться как один символ, так и более сложный шаблон.
Регулярные выражения могут использоваться для выполнения всех видов операций текстового поиска и замены.
Синтаксис:
/шаблон/модификаторы;
Var patt = /msiter/i;
Объяснение примера:
В JavaScript регулярные выражения часто используют в двух методах строки: search() и replace() .
Метод search() использует выражение для поиска совпадения и возвращает позицию найденного совпадения.
Метод replace() возвращает измененную строку, где произведена замена шаблона.
В следующем примере для регистронезависимого поиска используется регулярное выражение:
Var str = "Посетите сайт MSiter"; var n = str.search(/msiter/i);
В результате в переменную n будет возвращено 14.
Метод search() в качестве параметра также может принимать строку. При этом строковый параметр преобразуется в регулярное выражение:
В следующем примере для поиска используется строка "MSiter":
Var str = "Посетите сайт MSiter!"; var n = str.search("MSiter");
В следующем примере, чтобы заменить подстроку "Microsoft" на "Msiter" без учета регистра, используется регулярное выражение:
Var str = "Посетите сайт Microsoft!"; var res = str.replace(/microsoft/i, "MSiter");
В результате в переменной res будет строка "Посетите сайт MSiter!".
Метод replace() в качестве параметра также может принимать строку:
Var str = "Посетите сайт Microsoft!"; var res = str.replace("Microsoft", "MSiter");
А вы заметили, что
Модификаторы позволяют расширить область поиска:
Квадратные скобки используются для поиска в диапазоне символов:
Метасимволы - это символы со специальным значением:
Квантификаторы определяют количество повторений:
В JavaScript объект RegExp - это объект регулярного выражения с предопределенными свойствами и методами.
Метод test() объекта RegExp используется для поиска шаблона в заданной строке. В зависимости от результата он возвращает true или false.
Var patt = /e/; patt.test("The best things in life are free!");
Так как в этом примере строка содержит символ "e", результат будет true.
Для работы с объектом RegExp не обязательно сначала помещать регулярное выражение в переменную. Две строчки кода предыдущего примера можно сократить до одной:
/e/.test("The best things in life are free!");
Метод exec() объекта RegExp используется для поиска шаблона в заданной строке. Он возвращает найденный текст. Если ничего не было найдено, то возвращается null.
В следующем примере в строке ищется символ "e":
/e/.exec("The best things in life are free!");
Так как в этом примере строка содержит символ "e", результат будет - e.
new RegExp(pattern[, flags])регелярное выражение ЗАРАНЕЕ
Известно, то предпочтительнее синтаксис литерала (/test/i).
Если же регулярное выражение заранее неизвестно, то предпочтительнее создавать регулярное выражение (в символьной строке) при помощи конструктора (new RegExp).
Но обратите внимание, так как "знак косой черты" \ играет роль переключения кода, то в строковом литереале (new RegExp) его приходится писать дважды: \\
i игнорирование регистра при сопоставлении
g глобальное сопоставление, в отличие от локального (по умолчанию, совпадение только с первым экземпляром шаблоном) допускает совпадения со всеми экземплярами шаблона
| Что | Как | Описиние | Использование |
|---|---|---|---|
| i | флаг | делает рег. выражение не зависящим от регистра | /testik/i |
| g | флаг | глобальный поиск | /testik/g |
| m | флаг | допускает сопоставление со многими строками, которые могут быть получены из textarea | |
| оператор класса символов | сопоставление с набором символов | - любой символ в интервале от a до z; | |
| ^ | оператор знак вставки | кроме | [^a-z] - любой символ КРОМЕ символов в интервале от a до z; |
| - | оператор дефис | указываем диапозон значений, включительно | - любой символ в интервале от a до z; |
| \ | оператор экранирования | экранирует любой следующий символ | \\ |
| ^ | оператор начала сопоставления | сопоставление с шаблоном должно произойти в начале | /^testik/g |
| $ | оператор конца сопоставления | сопоставление с шаблоном должно произойти в конце | /testik$/g |
| ? | оператор? | делает символ необязательным | /t?est/g |
| + | оператор + | /t+est/g | |
| + | оператор + | символ должен присутстовать однократно или многократно | /t+est/g |
| * | оператор * | символ должен присутстовать однократно или многократно или вообще отсутствовать | /t+est/g |
| {} | оператор {} | задаем фиксированное число повторений символа | /t{4}est/g |
| {,} | оператор {,} | задаем число повторений символа в определенных пределах | /t{4,9}est/g |
| Предопределенный член | Сопоставление |
|---|---|
| \t | горизонтальная табуляция |
| \n | Перевод строки |
| . | Любой символ, кроме Перевода строки |
| \d | Любая десят-я цифра, что равнозначно |
| \D | Любой символ, кроме десят-я цифры, что равнозначно [^0-9] |
| \w | Любой символ (цифры, буквы и знак подчеркивания) что равнозначно |
| \W | Любой символ, кроме цифр, букв и знака подчеркивания, что равнозначно [^A-Za-z0-9] |
| \s | Любой символ пробела |
| \S | Любой символ, кроме пробела |
| \b | Граница слова |
| \B | НЕ Граница слова, а его внутр. часть |
Если оператор, например, + (/(abcd)+/) требуется применить к группе члеров, то можно воспользоваться круглыми скобками () .
Часть регулярного выражения, заключенная в круглые скобки () , назывыется фиксацией .
Рассмотрим следующий пример:
/^()k\1/
\1 это не любой символ из a , b , c .
\1 это какой угодно символ, который инициирует совпадение с первым символом
. То есть символ совпавший с
\1 неизвестен до разрешения регулярного выражения.
Скобки () используются в 2-х случаях: для группирования и для обозначение фиксаций. Но бывают ситуации, когда нам нужно использовать () только для группирования, так как фиксация не требуется, кроме того, убирая лишние фиксации мы облегчаем работу механизму обработки регулярных выражений.
Итак, чтобы предотвратить фиксацию перед открывающей круглой скобкой необходимо поставить: ?:
Str = "
Функция test проверяет, есть ли совпадение регулярного выражения со строкой (str). Возвращает или true или false .
Пример использования:
Функция match возвращает массив значений или null , если совпадений не найдено. Отметьте : если в регулярном выражении отсутствует флаг g (для выполнения глобального поиска), то метод match вернет первое совпадение в строке, при этом, как видно из примера, в массив совпадений попадают ФИКСАЦИИ (часть регулярного выражения заключенная в круглые скобки).
Если же предоставить методу match() глобальное регулярное выражение (с флажком g), то будет возвращен также массив, но с ГЛОБАЛЬНЫМИ совпадениями . То есть зафиксированные результаты не возвращаются.
Функция exec проверяет, есть ли совпадение регулярного выражения со строкой (str). Возвращает массив результатов (с фиксациями) или null . При каждом последующем вызове метода exec (например, при использовании while) происходит (за счет автоматического обновления при выполнении exec индекса конца последнего поиска lastIndex) переход к следующему глобальному совпадению (если у казан флажок g).
Без глобального флажка методы match и exec работают идентично. То есть возвращают массив с первым глобальным совпадением и фиксациями.
Возвращаемое значение данной функции служит в качестве замены.
Параметры функции :
Mетод не меняет вызывающую строку, а возвращает новую, после замены совпадений. Чтобы произвести глобальный поиск и замену, используйте regexp c флагом g .
"GHGHGHGTTTT".replace(//g,"K"); //"KKKKKKKKKKK"
Класс RegExp в JavaScript представляет собой регулярные выражения – объект, описывающий символьный шаблон. Объекты RegExp , как правило, создаются с помощью специального синтаксиса литералов, представленного ниже, но так же могут быть созданы посредством конструктора RegExp().
Значения параметров:
| Флаг | Описание |
|---|---|
| g | Позволяет найти все совпадения, а не останавливаться после первого совпадения (global match flag ). |
| i | Позволяет выполнить сопоставление без учета регистра (ignore case flag ). |
| m | Сопоставление производится по нескольким строкам. Обработка начальных и конечных символов (^ и $) производится по нескольким строкам, то есть сопоставление происходит с началом или концом каждой строки (разделители \n или \r), а не только с началом, или концом всей строки (multiline flag ). |
| u | Шаблон будет расценен как последовательность кодовых точек Юникода (unicode flag ). |
| y | Сопоставление происходит по индексу на который указывает свойство lastIndex этого регулярного выражения, при этом сопоставление не производиться по более позднему, или раннему индексу (sticky flag ). |
| Символ | Описание |
|---|---|
| . | Позволяет найти один символ, кроме символа новой строки, или символа конца строки (\n, \r, \u2028 или \u2029). |
| \d | Позволяет найти символ цифры в базовом латинском алфавите. Эквивалентин использованию набору символов . |
| \D | Позволяет найти любой символ, который не является цифрой в базовом латинском алфавите. Эквивалентен набору символов [^0-9]. |
| \s | Позволяет найти одиночный пробельный символ. Под пробельным символом понимается пробел, табуляция, перевод страницы, перевод строки и другие пробельные символы Юникода. Эквивалентен набору символов [\f\n\r\t\v\u00a0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u2028\u2029\u202f\u205f\u3000]. |
| \S | Позволяет найти одиночный символ, который не является пробельным. Под пробельным символом понимается пробел, табуляция, перевод страницы, перевод строки и другие пробельные символы Юникода. Эквивалентен набору символов [^ \f\n\r\t\v\u00a0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u2028\u2029\u202f\u205f\u3000]. |
| [\b] | Позволяет найти символ backspace (специальный символ \b, U+0008). |
| \0 | Позволяет найти символ 0 (ноль). |
| \n | Позволяет найти символ новой строки. |
| \f | Позволяет найти символ перевода страницы. |
| \r | Позволяет найти символ возврата каретки. |
| \t | Позволяет найти символ горизонтальной табуляции. |
| \v | Позволяет найти символ вертикальной табуляции. |
| \w | Позволяет найти любой буквенно-цифровой символ базового латинского алфавита, включая подчеркивание. Эквивалентен набору символов . |
| \W | Позволяет найти любой символ, который не является символом из базового латинского алфавита. Эквивалентен набору символов [^a-Za-z0-9_]. |
| \cX | Позволяет найти контрольный символ в строке. Где X - буква от A до Z. Например, /\cM/ обозначает символ Ctrl-M. |
| \xhh | Позволяет найти символ, используя шестнадцатеричное значение (hh - двухзначное шестнадцатеричное значение). |
| \uhhhh | Позволяет найти символ, используя кодировку UTF-16 (hhhh - четырехзначное шестнадцатеричное значение). |
| \u{hhhh} или \u{hhhhh} | Позволяет найти символ со значением Юникода U+hhhh или U+hhhhh (шестнадцатеричное значение). Только когда задан флаг u . |
| \ | Указывает, что следующий символ является специальным и не должен интерпретироваться буквально. Для символов, которые обычно трактуются специальным образом, указывает, что следующий символ не является специальным и должен интерпретироваться буквально. |
| Символ | Описание |
|---|---|
| n* | Сопостовление происходит с любой строкой, содержащей ноль или более вхождений символа n . |
| n+ | Сопостовление происходит с любой строкой, содержащей хотя бы один символ n . |
| n? | Сопостовление происходит с любой строкой с предшествующим элементом n ноль или один раз. |
| n{x} | Соответствует любой строке, содержащей последовательность символов n определенное количество раз x . X |
| n{x,} | x вхождений предшествующего элемента n . X должно быть целым положительным числом. |
| n{x, y} | Соответствует любой строке, содержащей по крайней мере x , но не более, чем с y вхождениями предшествующего элемента n . X и y должны быть целыми положительными числами. |
| n*? n+? n?? n{x}? n{x,}? n{x,y}? | Сопостовление происходит по аналогии с квантификаторами *, +, ? и {...}, однако при этом поиск идет минимально возможного сопоставления. По умолчанию используется "жадный" режим, ? в конце квантификатора позволяет задать "нежадный" режим при котором повторение сопоставления происходит минимально возможное количество раз. |
| x(?=y) | Позволяет сопоставить x , только если за x следует y . |
| x(?!y) | Позволяет сопоставить x , только если за x не следует y . |
| x|y | Сопоставление происходит с любой из указанных альтернатив. |
| Символ | Описание |
|---|---|
| (x) | Позволяет найти символ x и запомнить результат сопоставления ("захватывающие скобки"). Сопоставленная подстрока может быть вызвана из элементов результирующего массива ..., [n], или из свойств предопределенного объекта RegExp $1 ..., $9. |
| (?:x) | Позволяет найти символ x , но не запоминать результат сопоставления ("незахватывающие скобки"). Сопоставленная подстрока не может быть вызвана из элементов результирующего массива ..., [n], или из свойств предопределенного объекта RegExp $1 ..., $9. |
| \n | Обратная ссылка на последнюю подстроку, совпадающую с n-ой по счёту в круглых скобках в регулярном выражении (нумерация скобок идет слева направо). n должно быть целым положительным числом. |
