Руководство для начинающих по регулярным выражениям в JavaScript

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

Однако не всегда все так просто. Будут времена, когда вы будете искать не определенную подстроку, а набор подстрок, которые следуют определенному шаблону.

Допустим, вы должны заменить все вхождения «Яблоки» в строке на «яблоки». Вы можете просто использовать theMainString.replace("Apples", "apples") . Легко и приятно.

Теперь предположим, что вы также должны заменить «appLes» на «яблоки». Точно так же «яблоки» тоже должны стать «яблоками». По сути, все варианты вариантов «Apple» необходимо изменить на «яблоко». Передача простых строк в качестве аргумента больше не будет практичной или эффективной в таких случаях.

Вот тут и приходят регулярные выражения — вы можете просто использовать регистрозависимый флаг i и покончить с этим. При установленном флаге не имеет значения, содержала ли исходная строка «Яблоки», «APPles», «ApPlEs» или «Яблоки». Каждый экземпляр слова будет заменен на «яблоки».

Как и флаг без учета регистра, регулярные выражения предлагают множество других функций, которые будут рассмотрены в этом руководстве.

Использование регулярных выражений в JavaScript

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

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

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

Обратная косая черта в регулярных выражениях

Вы можете превратить обычные символы в специальные символы, добавив перед ними обратную косую черту. Точно так же вы можете превратить специальные символы в обычные символы, добавив перед ними обратную косую черту.

Например, d не является специальным символом. Тем не менее, \d используется, чтобы соответствовать символу цифры в строке. Аналогично, D не является специальным символом, но \D используется для сопоставления нецифровых символов в строке.

Цифровые символы включают 0, 1, 2, 3, 4, 5, 6, 7, 8 и 9. Когда вы используете \d внутри регулярного выражения, оно будет соответствовать любому из этих девяти символов. Когда вы используете \D внутри регулярного выражения, оно будет соответствовать всем нецифровым символам.

Следующий пример должен прояснить ситуацию.

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

Так же, как \d и \D , есть и другие последовательности специальных символов.

1. Вы можете использовать \w чтобы сопоставить любой символ «слово» в строке. Здесь символ слова относится к AZ, az, 0-9 и _. Таким образом, в основном, он будет соответствовать всем цифрам, всем строчным и прописным буквам, а также подчеркиванию.
2. Вы можете использовать \W для сопоставления любого несловесного символа в строке. Он будет соответствовать символам, таким как%, $, #, ₹ и т. Д.
3. Вы можете использовать \s для сопоставления одного символа пробела, который включает пробел, табуляцию, перевод формы и перевод строки. Точно так же вы можете использовать \S для сопоставления всех других символов, кроме пробела.
4. Вы также можете искать определенный символ пробела, используя \f , \n , \r , \t и \v , которые обозначают перевод формы, перевод строки, возврат каретки, горизонтальную и вертикальную табуляции.

Иногда вы сталкиваетесь с ситуациями, когда вам нужно заменить слово его заменой, но только если это не так. часть более крупного слова. Например, рассмотрим следующее предложение:

Msgstr «В приложении было размещено множество изображений ананасов».

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

Msgstr «В приложении было размещено множество изображений из сосны».

В таких случаях вы можете использовать другую специальную последовательность символов: \b . Это проверяет границы слов. Граница слова формируется с использованием любых несловесных символов, таких как пробел, «$», «%», «#» и т. Д. Однако будьте внимательны — в него также входят акцентированные символы, такие как «ü».

Точно так же вы можете использовать \B чтобы соответствовать границе не слова. Например, вы можете использовать \B для соответствия «app», только если оно находится внутри другого слова, например «ананас».

Соответствие шаблону «n» Количество раз

Вы можете использовать ^ чтобы указать JavaScript, что поиск совпадения происходит только в начале строки. Точно так же вы можете использовать $ только для просмотра конца строки.

Вы можете использовать * соответствовать предыдущему выражению 0 или более раз. Например, /Ap*/ будет соответствовать A , Ap , App , Appp и т. Д.

Аналогичным образом, вы можете использовать + чтобы соответствовать предыдущему выражению 1 или более раз. Например, /Ap+/ будет соответствовать Ap , App , Appp и т. Д. Выражение не будет соответствовать одиночному А на этот раз.

Иногда вы хотите сопоставить только определенное количество вхождений данного шаблона. В таких случаях вам следует использовать последовательность символов {n} , где n — это число. Например, /Ap{2}/ будет соответствовать App, но не Ap . Он также будет соответствовать первым двум ‘p в Appp и оставит третье нетронутым.

Вы можете использовать {n,} для сопоставления по крайней мере ‘n’ вхождений данного выражения. Это означает, что /Ap{2,}/ будет соответствовать App, но не Ap . Он также будет соответствовать всем ‘p в Apppp и заменяет их вашей строкой замены.

Вы также можете использовать {n,m} чтобы указать минимальное и максимальное число и ограничить количество совпадений с данным выражением. Например, /Ap{2,4}/ будет соответствовать App , Appp и Apppp . Он также будет соответствовать первым четырем ‘p в Apppppp и оставит их нетронутыми.

Использование скобок для запоминания совпадений

Пока что мы заменили шаблоны только постоянной строкой. Например, в предыдущем разделе мы всегда использовали замену «Добавить». Иногда вам придется искать соответствие шаблону внутри заданной строки, а затем заменять его частью шаблона.

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

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

Внутри строки замены первое совпадение будет идентифицировано с помощью $1 , второе совпадение будет идентифицировано с помощью $2 и так далее. Вот еще один пример, чтобы уточнить использование скобок.

Использование флагов с регулярными выражениями

Как я упоминал во введении, еще одна важная особенность регулярных выражений — это использование специальных флагов для изменения способа поиска. Флаги являются необязательными, но вы можете использовать их для таких вещей, как глобальный поиск или без учета регистра.

Это четыре наиболее часто используемых флага для изменения способа поиска или замены строки в JavaScript.

• g : этот флаг будет выполнять глобальный поиск вместо остановки после первого совпадения.
• i : Этот флаг будет выполнять поиск без проверки на точное совпадение регистра. Например, Apple, aPPLe и apPLE обрабатываются одинаково при поиске без учета регистра.
• m : этот флаг будет выполнять многострочный поиск.
• y : этот флаг будет искать совпадение в индексе, указанном свойством lastIndex .

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

Последние мысли

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

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

Если есть что-то, что вы хотели бы, чтобы я разъяснил в этом уроке, не стесняйтесь, дайте мне знать в комментариях.