Shulou(Shulou.com)06/02 Report--

This article shows you what is the difference among test, exec and match in regular expressions. The content is concise and easy to understand, which can definitely brighten your eyes. I hope you can get something through the detailed introduction of this article.

Simple differences between test, exec, and match

1 、 test

Test returns Boolean to see if there is a pattern in the corresponding string. Var str = "1a1b1c"; var reg = new RegExp ("1.", "); alert (reg.test (str)); / / true

2 、 exec

Exec finds and returns the current match result and returns it as an array. Var str = "1a1b1c"; var reg = new RegExp ("1.", "); var arr = reg.exec (str); if there is no pattern, arr is null, otherwise arr is always an array of length 1 whose value is the current match. Arr also has three properties: the location of the current match of index; the location of the end of the current match of lastIndex (index + the length of the current match); and input in the example of input is str.

The exec method is affected by the parameter g. If g is specified, the next time exec is called, the search will start with the last matching lastIndex. Var str = "1a1b1c"; var reg = new RegExp ("1.", "); alert (reg.exec (str) [0]); alert (reg.exec (str) [0]); both outputs are 1a. Now look at the specified parameters g: var str = "1a1b1c"; var reg = new RegExp ("1.", "g"); alert (reg.exec (str) [0]); alert (reg.exec (str) [0]); the first output 1a and the second output 1b.

3 、 match

Match is a method of the String object. Var str = "1a1b1c"; var reg = new RegExp ("1.", "); alert (str.match (reg)); match is a bit like exec, but: exec is the method of the RegExp object; math is the method of the String object. Another difference between the two is the interpretation of the parameter g. If the parameter g is specified, match returns all the results at once. Var str = "1a1b1c"; var reg = new RegExp ("1.", "g"); alert (str.match (reg)); / / alert (str.match (reg)); / / the result of this sentence is the same as that of the previous sentence. The result is an array with three elements: 1a, 1b, 1c.

Regular expression objects can be defined in two ways:

1. The first definition (constructor definition):

New RegExp (pattern, attributes); for example, var reg = new RegExp ("abc", "g")

Where pattern represents the content of the expression, and matches abc as shown above

Attributes:g, global matching, I is case-insensitive, m performs multi-line matching, g and I are the most used

2. The second definition (/ / text definition): / pattern/attributes.

For example, var reg = / abc/g

Detailed differences between exec and match:

1. Exec is a regular expression method, not a string method, and its parameters are strings, as shown below:

As defined above

Var reg = new RegExp ("abc"); var str = "3abc4people 5abc6"; reg.exec (str)

2. Match is a method for strings to execute matching regular expression rules, and its parameters are regular expressions, such as

Var reg = new RegExp ("abc"); var str = "3abc4people 5abc6"; str.match (reg)

3. Both exec and match return arrays (regular expressions have no subexpressions and are defined as non-global matches)

If the regular expression executed by exec does not have a subexpression (the contents in parentheses, such as (\ s*) in / abc (\ s*) /), if there is a match, the first matching string content is returned. In this case, the array has only one element, and null is returned if there is no match.

Var reg = new RegExp ("abc"); var str = "3abc4Magne5abc6"; alert (reg.exec (str)); alert (str.match (reg))

Execute the code above and you will find that both contents are the same: abc

4. If a regular expression object is defined as a global match such as (a regular expression does not have a subexpression and is defined as a global match)

Var reg = new RegExp ("abc", "g"); var str = "3abc4 Magazine 5abc6"; alert (reg.exec (str)); alert (str.match (reg))

True for abc and abc,abc; because match executes a global matching query; exec will only find a match if there is no subexpression, that is, it will be returned.

5. When the representation contains subexpressions (regular expressions have subexpressions and are defined as non-global matches):

Var reg = new RegExp ("a (bc)"); var str = "3abc4 Magazine 5abc6"; alert (reg.exec (str)); alert (str.match (reg))

You will find that the result of both execution is: abc,bc

6. If the regular expression object is defined as a global match (the regular expression has a subexpression and is defined as a global match)

Var reg = new RegExp ("a (bc)", "g"); var str = "3abc4people 5abc6"; alert (reg.exec (str)); alert (str.match (reg))

The results returned by both are abc,bc and abc,abc

It is summarized as follows:

1. When a regular expression has no subexpression and is defined as a non-global match, the result executed by exec and match is the same, returning the first matching string content.

2. When the regular expression has no subexpression and is defined as a global match, exec and match execute, and there are multiple matches, then match returns an array of multiple elements.

3. When the regular expression has a sub-representation and is defined as a non-global match, the result executed by exec and match is the same as in case 5 above

4. When the regular expression has a sub-representation and is defined as a global match, the results executed by exec and match are not the same. In this case, match will ignore the sub-expression, find only the fully matching regular expression and return everything, as in case 6 above.

That is to say, exec has nothing to do with the global definition, while match is related to the global. When the definition is non-global, the execution results are the same.

There are parentheses in any language. Regular expressions are also a language, and the existence of parentheses makes the language more powerful.

Whether it is easy to use parentheses or not is a side standard to measure the level of mastery of rules.

In fact, the function of parentheses can be explained in a few words. Parentheses provide a grouping so that we can quote it.

To reference a grouping, there are two situations: referencing it in JavaScript and referencing it in regular expressions.

Although the content of this article is relatively simple, I also want to write it a little longer.

The contents include:

1. Grouping and branching structure

two。 Capture packet

3. Reverse reference

4. Non-capture packet

5. Related cases

1. Grouping and branching structure

These two are the most intuitive and primitive functions of parentheses.

1.1 grouping

We know that / ab / matches successive "a", and / (ab) + / is needed to match successive "ab".

The parentheses provide a grouping function so that the quantifier "+" acts on "ab" as a whole. The test is as follows:

Var regex = / (ab) + / gpolivar string = "ababa abbb ababab"; console.log (string.match (regex)); / / ["abab", "ab", "ababab"]

1.2 branching structure

In the multi-selection branch structure (p1 | p2), the role of parentheses here is also self-evident, providing all the possibilities of subexpressions.

For example, to match a string like this:

I love JavaScriptI love Regular Expression

You can use regularities:

Var regex = / ^ I love (JavaScript | Regular Expression) $/; console.log (regex.test ("I love JavaScript")); / / trueconsole.log (regex.test ("I love Regular Expression")); / / true

If you remove the parentheses from the regular, that is, / ^ I love JavaScript | the Regular Expression$/, matching string is "I love JavaScript" and "Regular Expression", which is certainly not what we want.

two。 Reference grouping

This is an important role of parentheses, with which we can do data extraction and more powerful replacement operations.

To use the benefits of it, you must use API in conjunction with the implementation environment.

Take the date as an example. Assuming that the format is yyyy-mm-dd, we can write a simple rule first:

Var regex = /\ d {4} -\ d {2} -\ d {2} /

Then modify it to the parenthesized version:

Var regex = / (\ d {4})-(\ d {2})-(\ d {2}) /

Why use this rule?

2.1 extract data

For example, to extract the year, month, and day, you can do this:

Var regex = / (\ d {4})-(\ d {2})-(\ d {2}) /; var string = "2017-06-12"; console.log (string.match (regex)); / / = > ["2017-06-12", "2017", "06", "12", index: 0, input: "2017-06-12"]

An array returned by match, the first element is the overall matching result, then the matching content of each group (in parentheses), then the matching subscript, and finally the input text. Note: the format of the array returned by a regular match is not the same if there is a modifier gjore match.

You can also use the exec method of a regular object:

Var regex = / (\ d {4})-(\ d {2})-(\ d {2}) /; var string = "2017-06-12"; console.log (regex.exec (string)); / / = > ["2017-06-12", "2017", "06", "12", index: 0, input: "2017-06-12"]

At the same time, you can also use the global properties $1 to $9 of the constructor to get:

Var regex = / (\ d {4})-(\ d {2})-(\ d {2}) /; var string = "2017-06-12"; regex.test (string); / / regular operation, such as / / regex.exec (string); / / string.match (regex); console.log (RegExp.$1); / / "2017" console.log (RegExp.$2); / / "06" console.log (RegExp.$3); / / "12"

2.2 replace

For example, what if you want to replace the yyyy-mm-dd format with mm/dd/yyyy?

Var regex = / (\ d {4})-(\ d {2})-(\ d {2}) /; var string = "2017-06-12"; var result = string.replace (regex, "$2max / 3max / 1"); console.log (result); / / "06x12 / 2017"

In replace, $1, $2, and $3 are used in the second parameter to refer to the corresponding grouping. It is equivalent to the following form:

Var regex = / (\ d {4})-(\ d {2})-(\ d {2}) /; var string = "2017-06-12"; var result = string.replace (regex, function () {return RegExp.$2 + "/" + RegExp.$3 + "/" + RegExp.$1;}); console.log (result); / / "06hand 122017"

It is also equivalent to:

Var regex = / (\ d {4})-(\ d {2})-(\ d {2}) /; var string = "2017-06-12"; var result = string.replace (regex, function (match, year, month, day) {return month + "/" + day + "/" + year;}); console.log (result); / / "06and12and2017"

3. Reverse reference

In addition to using the corresponding API to refer to a grouping, you can also refer to a grouping in the rule itself. However, you can only refer to the grouping that occurred before, that is, the backreference.

Let's take the date as an example.

For example, to write a regular support to match the following three formats:

2016-06-12

2016-06-12

2016.06.12

The first thing you might think of is:

Var regex = /\ d {4} (- |\ / |\.)\ d {2} (- |\ / |\.)\ d {2} /; var string1 = "2017-06-12"; var string2 = "2017-06-12"; var string3 = "2017.06.12"; var string4 = "2016-06 string2 12"; console.log (regex.test (string1)); / / trueconsole.log (regex.test (string2)); / / trueconsole.log (regex.test (string3)) / / trueconsole.log (regex.test (string4)); / / true

Among them / and. Need to escape. Although it matches the required situation, it also matches data such as "2016-06 + 12".

What if we want to require the separator to be consistent? At this point, you need to use backreferences:

Var regex = /\ d {4} (- |\ / |\.)\ d {2}\ 1\ d {2} /; var string1 = "2017-06-12"; var string2 = "2017-06-12"; var string3 = "2017.06.12"; var string4 = "2016-06x12"; console.log (regex.test (string1)); / / trueconsole.log (regex.test (string2)); / / trueconsole.log (regex.test (string3)) / / trueconsole.log (regex.test (string4)); / / false

Notice the\ 1 inside, which indicates the packet before the reference (- |\ / |\.). No matter what it matches (such as -),\ 1 matches that same specific character.

Once we know the meaning of\ 1, then the concepts of\ 2 and\ 3 are understood, referring to the second and third groups, respectively.

See here, at this time, I am afraid you will have three questions.

3.1 what about the nesting of brackets?

The opening parenthesis (opening parenthesis) shall prevail. For example:

Var regex = / ^ ((\ d) (\ d)\ 1\ 2\ 3\ 4 $/; var string = "1231231233"; console.log (regex.test (string)); / / trueconsole.log (RegExp.$1); / / 123console.log (RegExp.$2); / / 1console.log (RegExp.$3); / / 23console.log (RegExp.$4); / / 3

We can take a look at this regular matching pattern:

The first character is a number, such as 1

The second character is a number, such as 2

The third character is a number, such as 3

The next is\ 1, which is the first grouping content, so look at the grouping corresponding to the first opening parenthesis, which is 123.

Next is\ 2, find the second opening parenthesis, the corresponding grouping, the matching content is 1

Next is\ 3, find the third open parenthesis, the corresponding grouping, the matching content is 23

Finally,\ 4, find the third open parenthesis, the corresponding grouping, the matching content is 3.

If you take a closer look at this question, you should understand it.

What does 3.2\ 10 mean?

Another question may be: does\ 10 represent the 10th group, or\ 1 and 0? The answer is the former, although it is rare for\ 10 to appear in a regular pattern. The tests are as follows:

Var regex = / (1) (2) (3) (4) (5) (6) (7) (8) (9) (#)\ 10 string string = "12345678" console.log (regex.test (string))

3.3 what happens if you reference a grouping that does not exist?

Because the reverse reference refers to the previous grouping, but when we refer to the grouping that does not exist in the rule, the regular will not report an error at this time, just matching the character of the reverse reference itself. For example,\ 2 matches "\ 2". Note that "\ 2" indicates a change of heart about 2.

Var regex = /\ 1\ 2\ 3\ 4\ 6\ 7\ 8\ 9 Universe console.log (regex.test ("\ 1\ 2\ 3\ 4\ 5\ 6\ 7\ 8\ 9"); console.log ("\ 1\ 2\ 3\ 4\ 5\ 7\ 8\ 9" .split ("")

The result printed by the chrome browser:

4. Non-capture packet

The groups that appear in the previous article capture the data they match for subsequent reference, so they are also called capture groups.

If you only want the original function of the parentheses, but will not reference it, that is, it is neither referenced in API nor backreferenced in regular. At this point, you can use non-capture grouping (?: P). For example, the first example in this article can be modified to:

Var regex = / (?: ab) + / GTX var string = "ababa abbb ababab"; console.log (string.match (regex)); / / ["abab", "ab", "ababab"]

5. Related cases

At this point, the role of parentheses has been finished, to sum up, that is to provide groups for us to use, how to use it depends on us.

5.1 string trim method simulation

The trim method removes the blank characters at the beginning and end of a string. There are two ways to do it.

First, match the blank characters at the beginning and end, and then replace them with empty characters. Such as:

Function trim (str) {return str.replace (/ ^\ s + |\ skeeper trim);} console.log (trim ("foobar")); / / "foobar"

Second, match the entire string and then use a reference to extract the corresponding data:

Function trim (str) {return str.replace (/ ^\ s * (. *?)\ s scratch Universe g, "$1");} console.log (trim ("foobar")); / / "foobar"

Lazy matching *? is used here, otherwise all spaces before the last space will be matched.

Of course, the former is efficient.

5.2 convert the first letter of each word to uppercase

Function titleize (str) {return str.toLowerCase () .replace (/ (?: ^ |\ s)\ return c.toUpperCase g, function (c) {return c.toUpperCase ();});} console.log (titleize ('my name is epeli')); / / "My Name Is Epeli"

The idea is to find the first letter of each word, but it's okay not to use a non-capture match here.

5.3 humping

Function camelize (str) {return str.replace (/ [- _\ s] + (.) / g, function (match, c) {return c? C.toUpperCase ():';});} console.log (camelize ('- moz-transform')); / / MozTransform

The initials are not converted to uppercase. Among them, grouping (.) Indicates the first letter, the definition of a word, and the preceding characters can be multiple hyphens, underscores, and blank characters. The one behind the regular? The purpose is to deal with the fact that the character at the end of the str may not be a word character, for example, str is'- moz-transform'.

5.4 Lineation in Chinese

Function dasherize (str) {return str.replace (/ ([Amurz]) / g,'- $1'). Replace (/ [- _\ s] + / g,'-'). ToLowerCase ();} console.log (dasherize ('MozTransform')); / /-moz-transform

The reverse process of humping.

5.5 html escaping and reversion

/ / convert HTML special characters to equivalent entities function escapeHTML (str) {var escapeChars = {'Yang': 'cent',' £': 'pound',' ¥': 'yen','?': 'euro',' ©': 'copy',' ®': 'reg',': 'gt',' "': 'quot',' &': 'amp' '':'# 39'} Return str.replace (new RegExp (''+ Object.keys (escapeChars) .join (') +]','g'), function (match) {return'&'+ escapeChars [match] +';';} console.log (escapeHTML ('Blah blah blah')); / / = > Blah blah blah

It doesn't have much to do with this article that uses the regular generated by the constructor and then replaces the corresponding format.

But its reverse process, which uses parentheses to provide references, is also simple, as follows:

/ / entity characters are converted to equivalent HTML. Function unescapeHTML (str) {var htmlEntities = {nbsp:', cent:'', pound:'£', yen:'¥', euro:'?, copy:'©', reg:'®', lt:', quot:', amp:'&', apos:'\'}; return str.replace (/\ & ([^;] +); / g, function (match, key) {if (key in htmlEntities) {return htmlEntities [key]) } return match;});} console.log (unescapeHTML ('Blah blah blah')); / / = > Blah blah blah

Get the corresponding grouping reference through key, and then act as the key of the object.

5.6 match pairs of tags

Requirements match:

Regular expression

Laoyao bye bye

Mismatch:

Wrong!

To match an open tag, you can use regular] + >

To match a closed tag, you can use] + >

However, if you are required to match pairs of tags, you need to use reverse references, such as:

Var regex = /] +) > [\ d\ D] * /; var string1 = "regular expression"; var string2 = "

Laoyao bye bye

"; var string3 =" wrong!

Console.log (regex.test (string1)); / / trueconsole.log (regex.test (string2)); / / trueconsole.log (regex.test (string3)); / / false

Where open label] > change to]) >, the purpose of using parentheses is to provide grouping for later use of reverse references. The closed tag uses a backreference.

In addition, [\ d\ D] means that the character is a number or not, so it means to match any character.

What is the difference between test, exec and match in regular expressions? have you learned any knowledge or skills? If you want to learn more skills or enrich your knowledge reserve, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.