В JavaScript регулярные выражения представлены объектами RegExp . Объекты RegExp могут быть созданы посредством конструктора RegExp(), но чаще они создаются с помощью специального синтаксиса литералов. Так же как строковые литералы задаются в виде символов, заключенных в кавычки, литералы регулярных выражений задаются в виде символов, заключенных в пару символов слэша / .
/pattern/флаги new RegExp("pattern"[, опции поиска])
pattern - регулярное выражение для поиска (о замене - позже), а флаги - строка из любой комбинации символов g(глобальный поиск), i(регистр неважен) и m(многострочный поиск). Первый способ используется часто, второй - иногда. Например, два таких вызова эквивалентны.
Опции поискаПри создании регулярного выражения мы можем указать дополнительных опции поиска
Символы в регулярных выражениях JavaScript| Алфавитно-цифровые символы | Соответствуют сами себе |
| \0 | Символ NUL (\u0000) |
| \t | Табуляция (\u0009) |
| \n | Перевод строки (\u000A) |
| \v | Вертикальная табуляция (\u000B) |
| \f | Перевод страницы (\u000C) |
| \r | Возврат каретки (\u000D) |
| \xnn | Символ из набора Latin, задаваемый шестнадцатеричным числом nn; например, \x0A - это то же самое, что \n |
| \uxxxx | Unicode-символ, заданный шестнадцатеричным числом xxxx; например, \u0009 - это то же самое, что \t |
| \cX | Управляющий символ "X", например, последовательность \cJ эквивалентна символу перевода строки \n |
| \ | Для обычных символов - делает их специальными. Например, выражение /s/ ищет просто символ "s". А если поставить \ перед s, то /\s/ уже обозначает пробельный символ.И наоборот, если символ специальный, например *, то \ сделает его просто обычным символом "звездочка". Например, /a*/ ищет 0 или больше подряд идущих символов "a". Чтобы найти а со звездочкой "a*" - поставим \ перед спец. символом: /a\*/ . |
| ^ | Обозначает начало входных данных. Если установлен флаг многострочного поиска ("m") , то также сработает при начале новой строки.Например, /^A/ не найдет "A" в "an A", но найдет первое "A" в "An A." |
| $ | Обозначает конец входных данных. Если установлен флаг многострочного поиска, то также сработает в конце строки.Например, /t$/ не найдет "t" в "eater", но найдет - в "eat". |
| * | Обозначает повторение 0 или более раз. Например, /bo*/ найдет "boooo" в "A ghost booooed" и "b" в "A bird warbled", но ничего не найдет в "A goat grunted". |
| + | Обозначает повторение 1 или более раз. Эквивалентно {1,} . Например, /a+/ найдет "a" в "candy" и все "a" в "caaaaaaandy". |
| ? | Обозначает, что элемент может как присутствовать, так и отсутствовать. Например, /e?le?/ найдет "el" в "angel" и "le" в "angle."Если используется сразу после одного из квантификаторов * , + , ? , или {} , то задает "нежадный" поиск (повторение минимально возможное количество раз, до ближайшего следующего элемента паттерна), в противоположность "жадному" режиму по умолчанию, при котором количество повторений максимально, даже если следующий элемент паттерна тоже подходит.Кроме того, ? используется в предпросмотре, который описан в таблице под (?=) , (?!) , и (?:) . |
| . | (Десятичная точка) обозначает любой символ, кроме перевода строки: \n \r \u2028 or \u2029. (можно использовать [\s\S] для поиска любого символа, включая переводы строк). Например, /.n/ найдет "an" и "on" в "nay, an apple is on the tree", но не "nay". |
| (x) | Находит x и запоминает. Это называется "запоминающие скобки". Например, /(foo)/ найдет и запомнит "foo" в "foo bar." Найденная подстрока хранится в массиве-результате поиска или в предопределенных свойствах объекта RegExp: $1, ..., $9 .Кроме того, скобки объединяют то, что в них находится, в единый элемент паттерна. Например, (abc)* - повторение abc 0 и более раз. |
| (?:x) | Находит x , но не запоминает найденное. Это называется "незапоминающие скобки". Найденная подстрока не сохраняется в массиве результатов и свойствах RegExp.Как и все скобки, объединяют находящееся в них в единый подпаттерн. |
| x(?=y) | Находит x , только если за x следует y . Например, /Jack(?=Sprat)/ найдет "Jack", только если за ним следует "Sprat". /Jack(?=Sprat|Frost)/ найдет "Jack", только если за ним следует "Sprat" или "Frost". Однако, ни "Sprat" ни "Frost" не войдут в результат поиска. |
| x(?!y) | Находит x , только если за x не следует y . Например, /\d+(?!\.)/ найдет число, только если за ним не следует десятичная точка. /\d+(?!\.)/.exec("3.141") найдет 141, но не 3.141. |
| x|y | Находит x или y . Например, /green|red/ найдет "green" в "green apple" и "red" в "red apple." |
| {n} | Где n - положительное целое число. Находит ровно n повторений предшествующего элемента. Например, /a{2}/ не найдет "a" в "candy," но найдет оба a в "caandy," и первые два a в "caaandy." |
| {n,} | Где n - положительное целое число. Находит n и более повторений элемента. Например, /a{2,} не найдет "a" в "candy", но найдет все "a" в "caandy" и в "caaaaaaandy." |
| {n,m} | Где n и m - положительные целые числа. Находят от n до m повторений элемента. |
| Набор символов. Находит любой из перечисленных символов. Вы можете указать промежуток, используя тире. Например, - то же самое, что . Найдет "b" в "brisket", а также "a" и "c" в "ache". | |
| [^xyz] | Любой символ, кроме указанных в наборе. Вы также можете указать промежуток. Например, [^abc] - то же самое, что [^a-c] . Найдет "r" в "brisket" и "h" в "chop." |
| [\b] | Находит символ backspace. (Не путать с \b .) |
| \b | Находит границу слов (латинских), например пробел. (Не путать с [\b]). Например, /\bn\w/ найдет "no" в "noonday"; /\wy\b/ найдет "ly" в "possibly yesterday." |
| \B | Обозначает не границу слов. Например, /\w\Bn/ найдет "on" в "noonday", а /y\B\w/ найдет "ye" в "possibly yesterday." |
| \cX | Где X - буква от A до Z. Обозначает контрольный символ в строке. Например, /\cM/ обозначает символ Ctrl-M. |
| \d | находит цифру из любого алфавита (у нас же юникод). Испльзуйте , чтобы найти только обычные цифры. Например, /\d/ или // найдет "2" в "B2 is the suite number." |
| \D | Найдет нецифровой символ (все алфавиты). [^0-9] - эквивалент для обычных цифр. Например, /\D/ или /[^0-9]/ найдет "B" в "B2 is the suite number." |
| \s | Найдет любой пробельный символ, включая пробел, табуляцию, переводы строки и другие юникодные пробельные символы. Например, /\s\w*/ найдет " bar" в "foo bar." |
| \S | Найдет любой символ, кроме пробельного. Например, /\S\w*/ найдет "foo" в "foo bar." |
| \v | Символ вертикальной табуляции. |
| \w | Найдет любой словесный (латинский алфавит) символ, включая буквы, цифры и знак подчеркивания. Эквивалентно . Например, /\w/ найдет "a" в "apple," "5" в "$5.28," и "3" в "3D." |
| \W | Найдет любой не-(лат.)словесный символ. Эквивалентно [^A-Za-z0-9_] . Например, /\W/ и /[^$A-Za-z0-9_]/ одинаково найдут "%" в "50%." |
Работа с регулярными выражениями в Javascript реализована методами класса String
exec(regexp) - находит все совпадения (вхождения в шаблон "регулярки") в строке. Возвращает массив (при совпадении) и обновляет свойство regexp-а, или null - если ничего не найдено,. С модификатором g - при каждом вызове этой функции, она будет возвращать следующее совпадение после предыдущего найденного - это реализовано с помощью ведения индекса смещения последнего поиска.
match(regexp) - найти часть строки по шаблону. Если указан модификатор g, то функция match() возвращает массив всех совпадений или null (а не пустой массив). Без модификатора g эта функция работает как exec();
test(regexp) - функция проверяет строку на соответствие шаблону. Возвращает true - если есть совпадение, и false - если совпадения нет.
split(regexp) - разбивает строку, для которой он вызван, на массив подстрок, используя аргумент в качестве разделителя.
replace(regexp, mix) - метод возвращает строку изменную в соответствии с шаблоном (регуляррным выражением). Первый параметр regexp также может содержать строку, а не регулярное выражение. Без модификатора g - метод в строке заменяет только первое вхождение; с модификатором g - происходит глобальная замена, т.е. меняются все вхождения в данной строке. mix - шаблон замены, может принитать значения строки, шаблона замены, функции (имя функции).
Спецсимволы в строке заменыЗамена через функциюЕсли Вы указываете вторым параметром функцию, то она выполняется при каждом совпадении. В функции можно динамически генерировать и возвращать строку подстановки. Первый параметр функции - найденная подстрока. Если первым аргументом replace является объект RegExp, то следующие n параметров содержат совпадения из вложенных скобок. Последние два параметра - позиция в строке, на которой произошло совпадение и сама строка.
Регулярное выражение – это объект, описывающий символьный шаблон. Класс RegExp в JavaScript представляет регулярные выражения, а объекты классов String и RegExp определяют методы, использующие регулярные выражения для выполнения поиска по шаблону и операций поиска в тексте с заменой.
Регулярные выражения – это мощное средство для обработки входящих данных. Задача, требующая замены или поиска текста, может быть красиво решена с помощью этого “языка внутри языка”.
СозданиеВ JavaScript регулярные выражения представлены объектами RegExp. Объекты RegExp могут быть созданы посредством конструктора RegExp(), но чаще они создаются с помощью специального синтаксиса литералов. Cпособы создания:
// Используя литерал регулярного выражения: var re = /ab+c/;
Литералы регулярных выражений вызывают предварительную компиляцию регулярного выражения при анализе скрипта.
// Вызывая функцию конструктор объекта RegExp var re = new RegExp("ab+c");
Использование конструктора влечет за собой компиляцию регулярного выражения во время исполнения скрипта. Использовать данный способ надо если известно что выражение будет изменяться.
Спецсимволы в регулярном выражении\ – Для обычных символов – делает их специальными. Например, выражение /s/ ищет просто символ ‘s’. А если поставить \ перед s, то /\s/ уже обозначает пробельный символ.
^ – Обозначает начало входных данных. Если установлен флаг многострочного поиска (“m”), то также сработает при начале новой строки.
$ – Обозначает конец входных данных. Если установлен флаг многострочного поиска, то также сработает в конце строки.
* – Обозначает повторение 0 или более раз. Например, /bo*/ найдет ‘boooo’ в “A ghost booooed” и ‘b’ в “A bird warbled”, но ничего не найдет в “A goat grunted”.
+ – Обозначает повторение 1 или более раз. Эквивалентно {1,}. Например, /a+/ найдет ‘a’ в “candy” и все ‘a’ в “caaaaaaandy”.
? – Обозначает, что элемент может как присутствовать, так и отсутствовать.
. – (Десятичная точка) обозначает любой символ, кроме перевода строки: \n \r \u2028 or \u2029. (можно использовать [\s\S] для поиска любого символа, включая переводы строк).
(x) – Находит x и запоминает. Это называется “запоминающие скобки”. Например, /(foo)/ найдет и запомнит ‘foo’ в “foo bar.” Найденная подстрока хранится в массиве-результате поиска или в предопределенных свойствах объекта RegExp: $1, …, $9.
(?:x) – Находит x, но не запоминает найденное. Это называется “незапоминающие скобки”. Найденная подстрока не сохраняется в массиве результатов и свойствах RegExp. Как и все скобки, объединяют находящееся в них в единый подпаттерн.
x(?=y) – Находит x, только если за x следует y. Например, /Jack(?=Sprat)/ найдет ‘Jack’, только если за ним следует ‘Sprat’. /Jack(?=Sprat|Frost)/ найдет ‘Jack’, только если за ним следует ‘Sprat’ или ‘Frost’. Однако, ни ‘Sprat’ ни ‘Frost’ не войдут в результат поиска.
x(?!y) – Находит x, только если за x не следует y. Например, /\d+(?!\.)/ найдет число, только если за ним не следует десятичная точка. /\d+(?!\.)/.exec(“3.141”) найдет 141, но не 3.141.
x|y – Находит x или y. Например, /green|red/ найдет ‘green’ в “green apple” и ‘red’ в “red apple.”
{n} – Положительное целое число. Находит ровно n повторений предшествующего элемента.
{n,} – Положительное целое число. Находит n и более повторений элемента.
{n,m} – Положительные целые числа. Находят от n до m повторений элемента.
– Набор символов. Находит любой из перечисленных символов. Можно указать промежуток, используя тире. Например, – то же самое, что .
[^xyz] – Любой символ, кроме указанных в наборе. Также можно указать промежуток. Например, [^abc] – то же самое, что [^a-c].
[\b] – Находит символ backspace.
\b – Находит границу слов (латинских).
\B – Обозначает не границу слов. Например, /\w\Bn/ найдет ‘on’ в “noonday”, а /y\B\w/ найдет ‘ye’ в “possibly yesterday.”
\cX – X – буква от A до Z. Обозначает контрольный символ в строке. Например, /\cM/ обозначает символ Ctrl-M.
\d – Находит цифру из любого алфавита.
\D – Найдет нецифровой символ (все алфавиты). [^0-9] – эквивалент для обычных цифр.
\f,\r,\n – Соответствующие спецсимволы form-feed, line-feed, перевод строки.
\s – Найдет любой пробельный символ, включая пробел, табуляцию, переводы строки и другие юникодные пробельные символы.
\S – Найдет любой символ, кроме пробельного.
\t – Символ табуляции.
\v – Символ вертикальной табуляции.
\w – Найдет любой (латинский) словесный символ, включая буквы, цифры и знак подчеркивания. Эквивалентно .
\W – Найдет любой (не латинский) словесный символ. Эквивалентно [^A-Za-z0-9_].
\0 – Найдет символ NUL.
\xhh – Найдет символ с кодом hh (2 шестнадцатиричных цифры).
\uhhhh – Найдет символ с кодом hhhh (4 шестнадцатиричных цифры).
ФлагиФлаги регулярных выражений задают высокоуровневые правила соответствия шаблонам. В отличие от остальной грамматики регулярных выражений, флаги указываются не между символами слэша, а после второго из них. В языке JavaScript поддерживается три флага.
Флаг i указывает, что поиск по шаблону должен быть нечувствителен к регистру символов, а флаг g – что поиск должен быть глобальным, т.е. должны быть найдены все соответствия в строке. Флаг m выполняет поиск по шаблону в многострочном режиме. Если строковое выражение, в котором выполняется поиск, содержит символы перевода строк, то в этом режиме якорные символы ^ и $, помимо того, что они соответствуют началу и концу всего строкового выражения, также соответствуют началу и концу каждой текстовой строки. Флаги могут объединяться в любые комбинации.
Методы класса StringСтроки поддерживают четыре метода, использующие регулярные выражения.
Метод search()Он принимает в качестве аргумента регулярное выражение и возвращает либо позицию первого символа найденной подстроки, либо -1, если соответствие не найдено. Например, следующий вызов вернет 4:
Var result = "JavaScript".search(/script/i); // 4
Если аргумент метода search() не является регулярным выражением, он сначала преобразуется путем передачи конструктору RegExp. Метод search() не поддерживает глобальный поиск и игнорирует флаг g в своем аргументе.
Метод replace()Он выполняет операцию поиска с заменой. Он принимает в качестве первого аргумента регулярное выражение, а в качестве второго – строку замены. Метод отыскивает в строке, для которой он вызван, соответствие указанному шаблону. Если регулярное выражение содержит флаг g, метод replace() заменяет все найденные совпадения строкой замены. В противном случае он заменяет только первое найденное совпадение.
Метод match()Он принимает в качестве единственного аргумента регулярное выражение (или преобразует свой аргумент в регулярное выражение, передав его конструктору RegExp()) и возвращает массив, содержащий результаты поиска. Если в регулярном выражении установлен флаг g, метод возвращает массив всех соответствий, присутствующих в строке. Например:
// вернет ["1", "2", "3"] var result = "1 плюс 2 равно 3".match(/\d+/g);
Если регулярное выражение не содержит флаг g, метод match() не выполняет глобальный поиск; он просто ищет первое совпадение. Однако match() возвращает массив, даже когда метод не выполняет глобальный поиск. В этом случае первый элемент массива – это найденная подстрока, а все оставшиеся элементы представляют собой подвыражения регулярного выражения.
Метод split()Этот метод разбивает строку, для которой он вызван, на массив подстрок, используя аргумент в качестве разделителя. Например:
"123,456,789".split(","); // Вернет ["123","456","789"]
Метод split() может также принимать в качестве аргумента регулярное выражение. Это делает метод более мощным.
Объект RegExpКонструктор RegExp() принимает один или два строковых аргумента и создает новый объект RegExp. Первый аргумент конструктора – это строка, содержащая тело регулярного выражения, т.е. текст, который должен находиться между символами слэша в литерале регулярного выражения. Второй аргумент RegExp() может отсутствовать. Если он указан, то определяет флаги регулярного выражения. Это должен быть один из символов g, i, m либо комбинация этих символов.
Свойства RegExpКаждый объект RegExp имеет пять свойств:
- source – строка, доступная только для чтения, содержащая текст регулярного выражения.
- global – логическое значение, доступное только для чтения, определяющее наличие флага g в регулярном выражении.
- ignoreCase i в регулярном выражении.
- multiline – это логическое значение, доступное только для чтения, определяющее наличие флага m в регулярном выражении.
- lastIndex – это целое число, доступное для чтения и записи. Для шаблонов с флагом g это свойство содержит номер позиции в строке, с которой должен быть начат следующий поиск.
Объекты RegExp определяют два метода, выполняющие поиск по шаблону.
Метод exec()Метод exec() выполняет регулярное выражение для указанной строки, т.е. ищет совпадение в строке. Если совпадение не найдено, метод возвращает null. Однако если соответствие найдено, он возвращает такой же массив, как массив, возвращаемый методом match() для поиска без флага g .
Нулевой элемент массива содержит строку, соответствующую регулярному выражению, а все последующие элементы – подстроки, соответствующие всем подвыражениям. В отличие от match(), метод exec() возвращает массив, структура которого не зависит от наличия в регулярном выражении флага g .
Когда метод exec() вызывается для того же регулярного выражения второй раз, он начинает поиск с символа, позиция которого указана в свойстве lastIndex. Если exec() не находит соответствия, свойство lastIndex получает значение 0.
Метод test()Он принимает строку и возвращает true, если строка соответствует регулярному выражению:
Var pattern = /java/i; pattern.test("JavaScript"); // Вернет true
Вызов test() эквивалентен вызову exec(), возвращающему true, если exec() возвращает не null. По этой причине метод test() ведет себя так же, как метод exec() при вызове для глобального регулярного выражения: он начинает искать указанную строку с позиции, заданной свойством lastIndex, и если находит соответствие, устанавливает свойство lastIndex равным номеру позиции символа, непосредственно следующего за найденным соответствием.
Написание шаблонаШаблон регулярного выражения состоит из обычных символов, например /abc/, или комбинаций обычных и специальных символов, например /ab*c/ или /Chapter (\d+)\.\d*/. Последний пример включает в себя скобки, которые используются как “запоминающий механизм”. Соответствие этой части шаблона запоминается для дальнейшего использования.
Использование простых шаблоновПростые шаблоны используются для нахождения прямого соответствия в тексте. Например, шаблон /abc/ соответствует комбинации символов в строке только когда символы ‘abc’ встречаются вместе и в том же порядке.
JavaScript regexp – это тип объекта, который используется для сопоставления последовательности символов в строках.
Создаем первое регулярное выражениеСуществует два способа создания регулярного выражения: с использованием литерала регулярного выражения или с помощью конструктора регулярных выражений. Каждый из них представляет один и тот же шаблон: символ «c », за которым следует «a », а затем символ «t ».
// литерал регулярного выражения заключается в слэши (/)
var option1 = /cat/;
// Конструктор регулярнго выражения
var option2 = new RegExp("cat");
Как правило, если регулярное выражение остается константой, то есть не будет меняться, лучше использовать литерал регулярного выражения. Если оно будет меняться или зависит от других переменных, лучше использовать метод с конструктором.
Метод RegExp.prototype.test()Помните, я говорил, что регулярные выражения являются объектами? Это означает, что у них есть ряд методов. Самый простой метод – это JavaScript regexp test , который возвращает логическое значение:
True (истина ): строка содержит шаблон регулярного выражения.
False (ложь ): совпадения не найдено.
console.log(/cat/.test(“the cat says meow”));
// верно
console.log(/cat/.test(“the dog says bark”));
// неверно
Секрет регулярных выражений заключается в запоминании типовых символов и групп. Я настоятельно рекомендую потратить несколько часов на таблицу, приведенную ниже, а затем вернуться, и продолжить изучение.
Символы- . – (точка ) соответствует любому одиночному символу за исключением переноса строки;
- * – соответствует предыдущему выражению, которое повторяется 0 или более раз;
- + – соответствует предыдущему выражению, которое повторяется 1 или более раз;
- ? – предыдущее выражение является необязательным (соответствует 0 или 1 раз );
- ^ – соответствует началу строки;
- $ – соответствует концу строки.
- d – соответствует любому одиночному цифровому символу.
- w – соответствует любому символу (цифре, букве или знаку подчёркивания).
- [XYZ ] – набор символов. Соответствует любому одиночному символу из набора, заданного в скобках. Также можно задавать и диапазоны символов, например, .
- [XYZ ]+ – соответствует символу из набора, повторяемого один или более раз.
- [^A —Z ] – внутри набора символов «^ » используется как знак отрицания. В данном примере шаблону соответствует всё, что не является буквами в верхнем регистре.
Флаги :
В 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 = /?/;
- d – это то же самое, что и : каждая конструкция соответствует цифровому символу.
- w – это то же самое, что [A —Za —z 0-9_] : оба выражения соответствуют любому одиночному алфавитно-цифровому символу или подчеркиванию.
В этом примере мы очень устали от «верблюжьего » стиля написания и нам нужен способ добавить пробелы между словами. Вот пример:
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"
capitalize("camel case") // => должен вернуть "Camel case"
Еще раз воспользуемся функцией в методе replace(). Однако на этот раз нам нужно искать только первый символ в строке. Напомним, что для этого используется символ «^ ».
Давайте на секунду задержимся на символе «^ ». Вспомните пример, приведенный ранее:
console.log(/cat/.test("the cat says meow"));
//верно
При добавлении символа «^ » функция больше не возвращает значение true , поскольку слово «cat » находится не в начале строки.
Синтаксис регулярных выражений является достаточно сложным и его изучение требует серьёзных усилий. Наилучшим руководством по регулярным выражением на сегодняшний день является книга Дж. Фридла "Регулярные выражения", позволяющая, по словам автора, "научиться мыслить регулярными выражениями".
Основные понятияРегулярное выражение (regular expression) - средство для обработки строк или последовательность символов, определяющая шаблон текста.
Модификатор - предназначен для "инструктирования" регулярного выражения.
Метасимволы - специальные символы, которые служат командами языка регулярных выражений.
Регулярное выражение задаётся как обычная переменная, только вместо кавычек используется слэш, например: var reg=/рег_выражение/
Под простейшими шаблонами будем понимать такие шаблоны, которые не нуждаются в каких-либо специальных символах.
Допустим, нашей задачей является замена всех букв "р" (малых и заглавных) на латинскую большую букву "R" в словосочетании Регулярные выражения
.
Создаём шаблон var reg=/р/ и воспользуясь методом replace осуществляем задуманное
var reg=/р/
document.write(result)
В результате получим строку - РегуляRные выражения , замена произошла только на первом вхождении буквы "р" с учётом регистра.
Но под условия нашей задачи этот результат не подходит... Тут нам понадобятся модификаторы
"g" и "i", которые могут использоваться как отдельно, так и совместно. Эти модификаторы ставятся в конце шаблона регулярного выражения, после слэша, и имеют следующие значения:
модификатор
"g" - задаёт поиск в строке как "глобальный", т.е. в нашем случае замена произойдет для всех вхождений буквы "р". Теперь шаблон выглядит так: var reg=/р/g
, подставив его в наш код
var str="Регулярные выражения"
var reg=/р/g
var result=str.replace(reg, "R")
document.write(result)
получим строку - РегуляRные выRажения .
модификатор "i"
- задаёт поиск в строке без учёта регистра, добавив этот модификатор в наш шаблон var reg=/р/gi
, после выполнения скрипта получим искомый результат нашей задачи - RегуляRные выRажения
.
Метасимволы задают тип символов искомой строки, способ окружения искомой строки в тексте, а так же количество символов отдельного типа в просматриваемом тексте. Поэтому метасимволы можно разделить на три группы:
- Метасимволы поиска совпадений.
- Количественные метасимволы.
- Метасимволы позиционирования.
Значение | Описание | ||
граница слова | задаёт условие, при котором шаблон должен выполняться в начале или конце слова | /\ber/
совпадает с error
, не совпадает с hero
или с player
|
|
не граница слова | задаёт условие, при котором шаблон не выполняется в начале или конце слова | /\Ber/
совпадает с hero
или с player
, не совпадает с error
|
|
цифра от 0 до 9 | /\d\d\d\d/ совпадает с любым четырёх значным числом |
||
/\D\D\D\D/ не совпадёт с 2005 или 05.г или №126 и т.д. |
|||
одиночный пустой символ | соответствует символу пробела | \over\sbyte\ совпадает только с over byte |
|
одиночный непустой символ | любой один символ за исключением пробела | \over\Sbyte\ совпадает с over-byte или с over_byte , не совпадает с over byte или over--byte |
|
буква, цифра или символ подчёркивания | /A\w/ совпадает с A1 или с AB , не совпадает с A+ |
||
не буква, цифра или символ подчёркивания | /A\W/ не совпадает с A1 или с AB , совпадает с A+ |
||
любой символ | любые знаки, буквы, цифры и т.д. | /.../ совпадает с любыми тремя символами ABC или !@4 или 1 q |
|
набор символов | задаёт условие, при котором шаблон должен выполняться при любом совпадении символов заключенных в квадратные скобки | /WERTY/ совпадает с QWERTY , с AWERTY |
|
набор не входящих символов | задаёт условие, при котором шаблон не должен выполняться при любом совпадении символов заключенных в квадратные скобки | /[^QA]WERTY/ не совпадает с QWERTY , с AWERTY |
Символы, приведенные в таблице "Метасимволы поиска совпадений" не надо путать с последовательностью знаков перехода используемых в строках, таких как \\t - табуляция, \\n - переход на новую строку и т.д.
Количественные метасимволыКоличество совпадений | ||
Ноль и большее количество раз | /Ja*vaScript/ совпадает с JvaScript или с JaavaScript или с JaaavaScript , не совпадает с JovaScript |
|
Ноль или один раз | /Ja?vaScript/ совпадает только с JvaScript или с JavaScript |
|
Один и большее количество раз | /Ja+vaScript/ совпадает с JavaScript или с JaavaScript или с JaaavaScript , не совпадает с JvaScript |
|
точно n раз | /Ja{2}vaScript/ совпадает только с JaavaScript |
|
n или большее количество раз | /Ja{2,}vaScript/ совпадает с JaavaScript или с JaaavaScript , не совпадает с JvaScript или с JavaScript |
|
по крайней мере, n раз, но не более чем m раз | /Ja{2,3}vaScript/ совпадает только с JaavaScript или с JaaavaScript |
Каждый символ, приведенный в таблице "Количественные метасимволы" применяется к одному предшествующему символу или метасимволу в регулярном выражении.
Метасимволы позиционированияПоследний набор метасимволов предназначен для обозначения, где искать (если это важно) подстроку в начале строки или в конце.
Некоторые методы для работы с шаблонамиreplace - данный метод мы уже использовали в самом начале статьи, он предназначен для поиска образца и замены найденной подстроки на новую подстроку.
exec - данный метод выполняет сопоставление строки с образцом, заданным шаблоном. Если сопоставление с образцом закончилось неудачей, то возвращается значение null . В противном случае результатом является массив подстрок, соответствующих заданному образцу. /*Первый элемент массива будет равен исходной строке удовлетворяющее заданному шаблону*/
например:
var reg=/(\d+).(\d+).(\d+)/
var arr=reg.exec("Я родился 15.09.1980")
document.write("Дата рождения: ", arr, "< br>")
document.write("День рождения: ", arr, "< br>")
document.write("Месяц рождения: ", arr, "< br>")
document.write("Год рождения: ", arr, "< br>")
в результате получим четыре строки:
Дата рождения: 15.09.1980
День рождения: 15
Месяц рождения: 09
Год рождения: 1980
В статье отображено далеко не все возможности и прелести регулярных выражений, для более глубокого изучения этого вопроса посоветую изучить объект RegExp. Так же хочу обратить внимание на то, что синтаксис регулярных выражений не чем не отличается как в JavaScript, так и в PHP. К примеру, для проверки правильности ввода e-mail, регулярное выражение, что для JavaScript, что для PHP будет выглядеть одинаково /+@+.{2,3}/i .
В этой статье рассмотрены основы применения регулярного выражения в Javascript .
Введение Что такое регулярное выражение?Регулярное выражение JS – это последовательность символов, которая формирует правило поиска. Затем это правило можно использовать для поиска по тексту, а также его замены. На практике регулярное выражение может состоять даже из одного символа, но чаще встречаются более сложные шаблоны поиска.
В Javascript регулярные выражения также являются объектами. Это шаблоны, использующиеся для сопоставления последовательностей символов в строках. Они используются в методах exec() и test() объекта RegExp , а также в методах match() , replace() , search и split() объекта String .
Пример
var pattern = /example/i
/example/i – это регулярное выражение. example – это шаблон (который будет использоваться в поиске ). i – это модификатор, указывающий на чувствительность к регистру.
Подготовка регулярного выраженияJS регулярные выражения состоят из шаблона и модификатора. Синтаксис будет примерно следующим:
/pattern/modifiers;
Шаблон задает правило поиска. Он состоит из простых символов наподобие /abc/ либо комбинации простых и специальных символов: /abc/ или /Chapter (d+).d/ .
Таблица шаблоновМодификаторы позволяют сделать запросы чувствительными к регистру, глобальными, и так далее. Они используются для проведения чувствительного к регистру поиска, а также глобального поиска.
Таблица модификаторов
Теперь мы готовы к тому, чтобы применить JS регулярные выражения. Существует два основных способа сделать это: используя объект регулярного выражения или регулярное выражение для строки.
Используем объект регулярного выражения Создаем объект регулярного выраженияЭтот объект описывает шаблон символов. Он используется для сопоставления шаблонов. Есть два способа сконструировать объект регулярного выражения.
Способ 1: используя литерал регулярного выражения, который состоит из шаблона, заключенного в слэши, например:
var reg = /ab+c/;
Литералы регулярных выражений запускают предварительную компиляцию регулярного выражения при анализе скрипта. Если регулярное выражение постоянно, то пользуйтесь им, чтобы увеличить производительность.
Способ 2: вызывая функцию-конструктор объекта RegExp , например:
var reg = new RegExp("ab+c");
Использование конструктора позволяет выполнить компиляцию регулярного выражения JS во время исполнения скрипта. Используйте данный способ, если регулярное выражение будет изменяться или не знаете шаблон заранее. Например, если вы получаете информацию от пользователя, который вводит поисковый запрос.
Методы объекта регулярного выраженияДавайте познакомимся с несколькими распространенными методами объекта регулярного выражения:
- compile() (устарел в версии 1.5 ) – компилирует регулярное выражение;
- exec() – производит сопоставление в строке. Возвращает первое совпадение;
- test() – производит сопоставление в строке. Возвращает значение true или false ;
- toString() – возвращает строчное значение регулярного выражения.
Метод test() – регулярное выражение объекта RegExp . Он производит поиск строки шаблона, и в зависимости от полученного результата возвращает значение true или false . Следующий JS регулярного выражения пример показывает, как происходит поиск в строке символа “e ”:
var patt = /e/; patt.test("Лучшие в мире вещи – бесплатны!");
Так как здесь в строке имеется “e ”, результатом данного кода будет значение true .
Регулярные выражения вовсе необязательно помещать в переменную. Такой же запрос можно провести в одну строку:
/e/.test("Лучшие в мире вещи – бесплатны!");
Применение exec()Он производит поиск в строке по заданному правилу поиска, и возвращает найденный текст. Если совпадений найдено не было, то результатом будет null .
Посмотрим на метод в действии, на примере того же символа “e ”:
/e/.exec("Лучшие в мире вещи – бесплатны!");
Так как в строке имеется “e ”, результатом данного кода будет .e .
Применение регулярного выражения для строкиВ Javascript эти выражения также можно использовать с двумя методами объекта String : search() и replace() . Они нужны для выполнения поиска и замены в тексте.
- Метод search() — использует выражение для поиска соответствия, и возвращает информацию о расположении соответствия;
- Метод replace() — возвращает модифицированную строку с замененным шаблоном.
Применение регулярного выражения JS для осуществления чувствительного к регистру поиска фразы “w3schools ” в строке:
var str = "Visit W3Schools"; var n = str.search(/w3schools/i);
Результатом в n будет 6.
Метод search также принимает строку в качестве аргумента. Аргумент string будет преобразован в регулярное выражение:
Применение string для поиска фразы “W3schools ” в строке:
var str = "Visit W3Schools!"; var n = str.search("W3Schools");
Применение чувствительного к регистру регулярного выражения JS для замены «Microsoft » на «W3Schools » в строке:
var str = "Visit Microsoft!"; var res = str.replace(/microsoft/i, "W3Schools");
В результате мы получим: «Visit W3Schools! «.
Метод replace() также принимает строку для поиска:
var str = “Visit Microsoft!”; var res = str.replace(“Microsoft”, “W3Schools”);
Перевод статьи “Using regular expression in Javascript ” был подготовлен дружной командой проекта