Article From:

If you are a beginner, this article can expand your understanding of the usage of regular expressions, but it is suggested that you read some introductory articles on regular expressions, such as the classic “30 minute introductory regular expression”. If you have a certain understanding of regular expressions, this article will let you know.New features in JavaScript.

With the update of ES2018, the gap between JavaScript regular expression and other PCRE based regular expression engines is getting smaller and smaller.

ES2018There are four more important updates:

  1. Lookbehinds
  2. Capture packet naming
  3. Meta character. Match newline
  4. UnicodeTransference


(?<=exp)Also calledThe zero width is recalling the post assertion,itThe position of assertion itself can match the expression exp.

/(?<=a)b/  // Match string B, string B is string a before, string a is not included in match result.

(?<!exp) Zero width negative Retrospection,Asserts that the front of this position does not match the expression exp

/(?<!a)b/  // Matches the string B. String B is not a string a before.

You will find that the two examples above do not capture the grouping.If you want to capture the grouping, you can add brackets around the expression you want to capture.

In this expression, the regular expression matches the object contained.Index 1captureCharacter a

groupsThe property is still empty, and that’s the next thing to say

 Capture packet naming

/(?<name>content)/  // Syntax: matching content and capturing packets, grouping named name

In order to create a named capture packet, all we need to do is write a question mark at the beginning of the parenthesis, and write the captured group name between the left and right brackets.

Example: match out string “Price: $19.00”The currency and price in it and the names of the groups respectively

    /^Price: (?<currency>\$)(?<numPrice>\d+\.\d+)$/
       .exec('Price: $15.99')

Currency grouping Name: currency, price grouping name numPrice

You can still use the numeric index to refer to the captured packets. If you access the groups attribute, you can read the custom group name to get the corresponding value.

Automatic packet regular expression reverse reference syntax: a backslash plus group number, such as \1, custom grouped reverse reference syntax is \k< groupName> the named capture group makes your expression easier to maintain


Meta character. Match newline

This is a very simple update.As you may know, in JavaScript regular expressions and many PCRE regular expressions, meta characters do not match newline characters.\n

    // false

We can see the return of false when we test.

In ES2018, we can add a s flag to make dot matching newline characters.

    // true

To be precise, there are other line terminators, such as carriage returns.\r,Or row separators and paragraph separators, which are respectivelyU+2028andU+2029


This is a heavy subject of documentation, because the document itself details every detail of this update.I will link toFileAs a reference.This document describes in detail how to match some Unicode character groups with some expressions instead of using any third party libraries.

In this section, we will focus on the discussionThis updatesomeActual use cases, rather than detailed descriptions of each Unicode group.

Let’s start with the demo.Suppose you want to match the Greek character.Before we decided not to use any third party libraries, how did we do it before ES2018?

You’re right,We have to create a character set.

    // true

Have to think about the capitals


In ES2018, we have a simpler symbol:

    // true

\p{Script=Greek}onlyMatch the Greek character,This is a good semantic shorthand.The number of Greek characters is limited, very much like English.At the same time, if there is no Unicode escape to match Chinese or Japanese, you have to write a lot of symbols there.The problem is solved through Unicode.

If you need to overcome some of the shortcomings of the JavaScript regular expression, I encourage you to use it.xRegExpLibrary.In fact, the JavaScript regular expression engine does not replace xRegExp so quickly.At the same time, the ES2018 regular expression engine is better and easier to maintain than before.


Link of this Article: ES2018 regular expression update

Leave a Reply

Your email address will not be published. Required fields are marked *