Differences between test, exec, and match in regular expressions and the use of parentheses, execmatch

Differences between test, exec, and match in regular expressions and the use of parentheses, execmatch

Simple differences between test, exec, and match

1. test

Test returns a Boolean value to check whether the corresponding string contains a pattern. Var str = "1a1b1c"; var reg = new RegExp ("1.", ""); alert (reg. test (str); // true

2. exec

Exec searches for and returns the current matching result, and returns the result as an array.var str = "1a1b1c"; var reg = new RegExp("1.", ""); var arr = reg.exec(str); If the mode does not exist, arr is null. Otherwise, arr is always an array with a length of 1, and its value is the current match. Arr also has three attributes: the position of the current matching item of the index; the position of the end of the current matching item of the lastIndex (index + Length of the current matching item); input is str in the preceding example.

The exec method is affected by the parameter g. If g is specified, the next time exec is called, it will start from the last matched lastIndex.var str = "1a1b1c"; var reg = new RegExp("1.", ""); alert(reg.exec(str)[0]); alert(reg.exec(str)[0]); Both outputs are 1a. Now let's look at the specified parameter g:var str = "1a1b1c"; var reg = new RegExp("1.", "g"); alert(reg.exec(str)[0]); alert(reg.exec(str)[0]); The first output is 1a and the second output is 1b.

3. match

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

The regular expression object has two definitions ::

1. Definition 1 (constructor definition ):

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

Here, pattern indicates the expression content, and the above indicates matching abc

Attributes: g, global match, I is case insensitive, m executes multi-row match, use the most g and I

2. Definition 2 (// 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. Its parameter is a string, as shown below:

As defined above

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

2. match is a string method for matching regular expression rules. Its parameters are regular expressions, as shown in figure

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

3. 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 content in parentheses, such as (\ s *) in/abc (\ s *)/, if there is a match, returns the content of the first matched string. At this time, the array has only one element. If there is no matching, null is returned;

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

After executing the code above, you will find that the content of both is the same: abc,

4. if you define a regular expression object as a global match (for example, a regular expression has no subexpression and is defined as a global match)

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

It is abc, abc, and abc. Because match performs a global match query, exec returns only one matching if no subexpression exists.

5. When the expression contains a subexpression (the regular expression has a subexpression and is defined as a non-global match ):

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

You will find that the execution results of both are: 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 = "3abc4,5abc6"; alert(reg.exec(str)); alert(str.match(reg));

The returned results are abc, bc, abc, abc,

Summary:

1. When the regular expression has no subexpression and is defined as a non-global match, the results of exec and match execution are the same, and the first matching string content is returned;

2. When the regular expression has no subexpression and is defined as a global match, exec and match are executed and there are multiple matching contents, match returns multiple element arrays;

3. When a regular expression has a subexpression and is defined as a non-global match, the results of exec and match execution are the same as those in the above 5th cases;

4. When a regular expression has a subexpression and is defined as a global match, the results of exec and match operations are different. In this case, match ignores the subexpression, only search for the full match Regular Expression and return all content, for example, in the above 6th cases;

That is to say, exec has no relation with whether the global is defined, while match is associated globally. If it is defined as non-global, the execution results of the two are the same.

Every language contains parentheses. Regular Expressions are also a language, and the presence of parentheses makes the language more powerful.

Whether brackets are handy is a side standard for measuring the level of regular expressions.

In fact, we can understand the role of parentheses in a few words. Parentheses provide grouping so that we can reference it easily.

To reference a group, you can reference it in JavaScript and in a regular expression.

Although the content in this article is relatively simple, I have to write it for a long time.

The content includes:

1. Grouping and branch structure

2. Capture Group

3. Reverse reference

4. Non-capturing Group

5. Related Cases

1. Grouping and branch structure

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

1.1 groups

We know that/a +/matches the continuous appearance of "a". To match the continuous appearance of "AB", we need to use/(AB) + /.

Brackets provide the grouping function to enable the quantizer "+" to act on the entire "AB". The test is as follows:

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

1.2 Branch Structure

In the multi-choice branch structure (p1 | p2), brackets are also self-evident, providing all the possibilities of subexpressions.

For example, to match the following string:

I love JavaScriptI love Regular Expression

You can use regular expressions:

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 in the Regular Expression, that is,/^ I love JavaScript | Regular Expression $/, the matching strings are "I love JavaScript" and "Regular Expression", of course this is not what we want.

2. Reference Group

This is an important role of parentheses. With it, we can extract data and perform more powerful replacement operations.

To use it, you must use APIs that implement the environment.

Take the date as an example. If the format is yyyy-mm-dd, We can first write a simple regular expression:

var regex = /\d{4}-\d{2}-\d{2}/;

Then change it to the bracket version:

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

Why use this regular expression?

2.1 Data Extraction

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

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"]

Match returns an array. The first element is the overall matching result, followed by the matching content of each group (in parentheses), followed by the matching subscript, and finally the input text. (Note: If the regular expression has a modifier g, the array format returned by match is different ).

You can also use the exec method of the 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"]

You can also use the global attribute $1 to $9 of the constructor to obtain the following information:

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

2.2 replace

For example, how do I replace yyyy-mm-dd with mm/dd/yyyy?

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

In replace, $1, $2, and $3 are used in the second parameter to represent the corresponding group. It is equivalent to the following format:

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); // "06/12/2017"

It is also equivalent:

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); // "06/12/2017"

3. Reverse reference

In addition to using the corresponding API to reference groups, you can also reference groups in the regular expression itself. However, you can only reference the previous group, that is, reverse reference.

Take the date as an example.

For example, to write a regular expression, the following three formats can be matched:

2016-06-
March 12
2016.06.12

The first possible regular expressions are:

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/12";console.log( regex.test(string1) ); // trueconsole.log( regex.test(string2) ); // trueconsole.log( regex.test(string3) ); // trueconsole.log( regex.test(string4) ); // true

The "/" and "." parameters must be escaped. Although it matches the requirements, it also matches data such as "2016-06/12.

What if we want to make the delimiter consistent? In this case, you need to use reverse reference:

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-06/12";console.log( regex.test(string1) ); // trueconsole.log( regex.test(string2) ); // trueconsole.log( regex.test(string3) ); // trueconsole.log( regex.test(string4) ); // false

Note that \ 1 indicates the group that references the previous one (-|\/ | \.). No matter what it matches (such as-), \ 1 matches the same specific character.

After we understand the meaning of \ 1, the concepts of \ 2 and \ 3 are understood, that is, they refer to the second and third groups respectively.

I'm afraid you have three problems.

3.1 What should we do with parentheses nesting?

The left brackets (parentheses) are used as the standard. For example:

var regex = /^((\d)(\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

Let's take a look at the regular expression matching mode:

The first character is a number, for example, 1,

The second character is a number, for example, 2,

The third character is a number, such as 3,

The next step is \ 1, which is the content of the first group. Let's take a look at the group corresponding to the first square brackets, which is 123,

Next is \ 2. Find 2nd square brackets and the corresponding group. The matching content is 1,

Next is \ 3. Find 3rd square brackets and the corresponding group. The matching content is 23,

The last one is \ 4. Find 3rd square brackets and the corresponding group. The matching content is 3.

This problem should be understood after a closer look.

What does 3.2 \ 10 mean?

Another question may be: \ 10 indicates 10th groups, or \ 1 and 0? The answer is the former, although \ 10 is rare in a regular expression. The test is as follows:

var regex = /(1)(2)(3)(4)(5)(6)(7)(8)(9)(#) \10+/;var string = "123456789# ######"console.log( regex.test(string) );

3.3 What If I reference a nonexistent group?

The reverse reference references the previous group, but when we reference a non-existent group in the regular expression, the regular expression does not return an error, but matches the character itself of the reverse reference. For example, \ 2 matches "\ 2 ". Note that "\ 2" indicates that 2 is converted.

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

Result printed by chrome:

4. Non-capturing Group

The groups that appear in the previous article will capture the matched data for subsequent reference. Therefore, they are also called capture groups.

If you only want the original feature of the brackets, but do not reference it, that is, it is neither referenced in the API nor reverse referenced in the regular expression. In this case, you can use a non-capture group (? : P). For example, the first example in this article can be changed:

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

5. Related Cases

So far, the role of parentheses has been completed. To sum up one sentence, we provide groups that can be used by us. How to Use them depends on us.

5.1 string trim method simulation

The trim method removes the spaces at the beginning and end of the string. There are two ways to do this.

First, match the blank characters at the beginning and end, and then replace them with null characters. For example:

function trim(str) { return str.replace(/^\s+|\s+$/g, '');}console.log( trim(" foobar ") ); // "foobar"

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

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

Here, the inert match *?, Otherwise, all spaces before the last space will be matched.

Of course, the former is highly efficient.

5.2 convert the first letter of each word into uppercase letters

function titleize(str) { return str.toLowerCase().replace(/(?:^|\s)\w/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. Of course, non-capturing matching is acceptable here.

5.3 camping

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

The initial letter is not converted to uppercase letters. The group (.) indicates the first letter and the definition of the word. The first character can be multiple hyphens, underscores, and white spaces. What follows the regular expression? The purpose is to deal with str tail characters may not be word characters, for example, str is '-moz-transform '.

5.4 strip

function dasherize(str) { return str.replace(/([A-Z])/g, '-$1').replace(/[-_\s]+/g, '-').toLowerCase();}console.log( dasherize('MozTransform') ); // -moz-transform

The inverse process of camping.

5.5 html conversion and Reversal

// Convert special HTML characters to the equivalent entity function escapeHTML (str) {var escapeChars = {'hour': 'cent ', '£': 'Pound ', '¥': 'yen ','? ': 'Euro ','©': 'Copy ','®': 'Reg', '<': 'lt ','> ': 'gt', '"': 'quot ',' & ': 'am ', '\ '':' #39 '}; return str. replace (new RegExp ('[' + Object. keys (escapeChars ). join ('') + ']', 'G'), function (match) {return '&' + escapeChars [match] + ';});} console. log (escapeHTML ('<div> Blah blah </div>'); // => <div> Blah blah </div>

Here, we use the regular expression generated by the constructor and then replace the corresponding format. This has little to do with this article.

But its inverse process uses parentheses to provide reference, which is also very simple, as follows:

// Convert entity characters to equivalent HTML characters. Function unescapeHTML (str) {var htmlEntities = {nbsp: '', cent: 'hangzhou', pound: '£', yen: '¥', euro :'? ', Copy :'©', Reg :'®', Lt:' <', gt:'> ', quot:' "', amp:' & ', apos:' \''}; return str. replace (/\ & ([^;] +);/g, function (match, key) {if (key in htmlEntities) {return htmlEntities [key];} return match;});} console. log (unescapeHTML ('<div> Blah blah </div>'); // => <div> Blah blah </div>

Obtain the corresponding group reference using the key and use it as the key of the object.

5.6 matching tags

Matching requirements:

<title>regular expression</title><p>laoyao bye bye</p>

Mismatch:

<title>wrong!</p>

Match an open tag. You can use a regular expression <[^>] +>,

Match a closed tag. You can use <\/[^>] +>,

However, to match tags in pairs, you need to use reverse references, such:

var regex = /<([^>]+)>[\d\D]*<\/\1>/;var string1 = "<title>regular expression</title>";var string2 = "<p>laoyao bye bye</p>";var string3 = "<title>wrong!</p>";console.log( regex.test(string1) ); // trueconsole.log( regex.test(string2) ); // trueconsole.log( regex.test(string3) ); // false

The label <[^>] +> is changed to <([^>] +)>. brackets are used to provide groups for reverse reference. The closed tag uses reverse reference, <\/\ 1>.

In addition, [\ d \ D] means that the character is a number or not a number, and thus matches any character.

Summary

The above section describes the differences between test, exec, and match in regular expressions and the usage of parentheses. I hope this will help you. If you have any questions, please leave a message, the editor will reply to you in a timely manner. Thank you very much for your support for the help House website!