Skip to main content

Regular expressions

@serverSerrverlesskiy

Regular expressions are a formal language for searching and manipulating strings in a text based on the use of metacharacters.

Regular expressions allow you to:

  • Search for text in a string
  • Replace substrings in a string
  • Extract information from a string

search

JavaScript, along with Perl, is one of the programming languages in which regular expression support is built directly into the language.

Difficulty to use​

the complexity of using

The disadvantage of regular expressions is that they often look strange and even intimidating. This is especially true for more complex templates.

let regExp = /^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/

Defining regular expressions​

search

The definition of a regular expression is the creation of a template on the basis of which work with strings will take place. In JavaScript, regular expressions are an object that can be defined in two ways.

Defining regular expressions using literals. For regular expressions, slashes / ... / are literals, they play the same role as the parentheses `` ... '' when creating strings.

let regExp = /pattern/

If you decide to create regular expressions using literals, then it should be borne in mind that this method of creation does not allow dynamic changes in the specified values. This is due to the fact that regular expression literals cause precompilation when the script is parsed.

Using​

pressing the button

Let's look at the use of regular expressions using an example:

let regExp = /banana/

With this codeπŸ“Ÿ we have createdπŸ—οΈ a simple regular expression that searches for the string banana. To test a regular expression, you can use the .test(string) method, the result of the method is a boolean value.

Live Editor
Result
Loading...

In the example, the regular expression looks for the substring banana in the string str.

Anchors​

anchor

Anchors tie a pattern to the beginning or end of a line. To bind to the beginning of a line, use ^, and to the end, use $.

Live Editor
Result
Loading...

Using this pattern / banana / you will search for banana in the whole line. If you need to check for a complete match of a string with a template, you need to use the anchors / ^ banana $ /. The .test () method will return true βœ… only if the whole line is banana.

Flags​

Flag

Flags are used to enhance regular expression searches.

  • g - when searching, searches for all matches;
  • i - search does not depend on case[Z-z];
  • m - multi-line mode;
  • s - turns on the dotall mode, in which the dot . can match a line feed character;
  • y - searches starting from the character that is at the position of the lastindex property** of the current regular expression;
  • u - enables Unicode support.

Using flags in different ways to create a regular expression pattern

let regExp = /pattern/anchor // prettier-ignore

Please note that the flags are integral part of the regular expression. Flags cannot be added or removed later. Also flags can be combined.

Live Editor
Result
Loading...

Try removing the i flag from the example.

Total​

The topic is very extensive and rarely used by us in development, so if you're interested, you can get acquainted with it in more detail here, hereand here.

Problems?​

Problem

Write to Discord chat.

Questions:​

Question

What are regular expressions for?

  1. Creation of templates
  2. String manipulation
  3. Editing strings

What character is used to literally create a regular expression?

  1. Slash /
  2. Backslash \
  3. Square brackets []

What is the way to create a regular expression that does not allow further dynamic changes to the given values?

  1. In literal
  2. In the constructor
  3. With any method, dynamic change is permissible

In order to understand how much you learned this lesson, take the test in the mobile application of our school on this topic or in our telegram bot.

JS Camp

  1. Learn JavaScript
  2. MDN Web Docs
  3. JS RegExp

Contributors βœ¨β€‹

Thanks goes to these wonderful people (emoji key):


IIo3iTiv

πŸ“–

Dmitriy Vasilev

πŸ’΅

Resoner2005

πŸ› 🎨 πŸ–‹

Navernoss

πŸ–‹ πŸ› 🎨

Become a Patron!