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

This article mainly shows you "how to use regular expressions in Javascript". The content is simple and clear. I hope it can help you solve your doubts. Let me lead you to study and learn this article "how to use regular expressions in Javascript".

Define

Regular expression (Regular Expression) is a syntax specification of a simple language. It is a powerful, convenient and efficient text processing tool. It is used in some methods to find, replace and extract information in strings.

Regular expressions in javascript are represented by RegExp objects and can be written in two ways: one is literal writing, the other is constructor writing.

Regular expressions are especially useful for dealing with strings, and there are many places where regular expressions can be used in JavaScript. This article summarizes the basics of regular expressions and the use of regular expressions in Javascript.

The first part briefly enumerates the use scenarios of regular expressions in JavaScript; the second part introduces the basic knowledge of regular expressions in detail and writes some examples to facilitate understanding.

The content of this article is my own summary after reading the regular expression writing and the chapter of js regular expression in the rhino book, so there may be omissions and inaccuracies in the content. If a great god passes by and finds something wrong in the article, you are welcome to correct the axe!

The use of regular expressions in Javascript

A regular expression can be thought of as a characteristic description of a character fragment, and its function is to find substrings that meet the conditions from a pile of strings. For example, I define a regular expression in JavaScript:

Var reg=/hello/ or var reg=new RegExp ("hello")

Then this regular expression can be used to find the word hello from a bunch of strings. The result of the "find out" action may be to find the location of the first hello, replace the hello with another string, find all the hello, and so on. The following is a list of functions in JavaScript that can use regular expressions, a brief introduction to the functions of these functions, and more complex uses will be introduced in part 2.

String.prototype.search method

It is used to find out the index that appears for the first time in a substring in the original string. If not,-1 is returned.

"abchello" .search (/ hello/); / / 3

String.prototype.replace method

Used to replace substrings in a string

"abchello" .replace (/ hello/, "hi"); / / "abchi"

String.prototype.split method

Used to split strings

"abchelloasdasdhelloasd" .split (/ hello/); / / ["abc", "asdasd", "asd"]

String.prototype.match method

Used to capture substrings in a string into an array. By default, only one result is captured into the array, and when the regular expression has the attribute of "global capture" (adding the parameter g when defining the regular expression), all results are captured into the array.

"abchelloasdasdhelloasd" .match (/ hello/); / ["hello"] "abchelloasdasdhelloasd" .match (/ hello/g); / / ["hello", "hello"]

Regular expressions as match parameters behave differently in the case of whether they have global properties, as will be discussed later in the regular expression grouping.

RegExp.prototype.test method

Used to test whether a string contains substrings

/ hello/.test ("abchello"); / / true

RegExp.prototype.exec method

Similar to the match method for strings, this method also captures strings that meet the criteria from a string into an array, but there are two differences.

1. The exec method can only capture one substring into the array at a time, regardless of whether the regular expression has a global attribute or not.

Var reg=/hello/g;reg.exec ("abchelloasdasdhelloasd"); / / ["hello"]

two。 The regular expression object (that is, the RegExp object in JavaScript) has a lastIndex property that indicates where to start the next capture, and each time the exec method is executed, lastIndex pushes back until no matching character is returned to null, and then captures from scratch. This property can be used to traverse substrings in the capture string.

Var reg=/hello/g;reg.lastIndex; / / 0reg.exec ("abchelloasdasdhelloasd"); / / ["hello"] reg.lastIndex; / / 8reg.exec ("abchelloasdasdhelloasd"); / / ["hello"] reg.lastIndex; / / 19reg.exec ("abchelloasdasdhelloasd"); / / nullreg.lastIndex; / / 0

Basis of regular expression

Metacharacter

The first section above takes / hello/ as an example, but practical applications may encounter the need to match an uncertain string of numbers, where the match begins, where the match ends, and match white space. Metacharacters can be used at this point.

Metacharacters:

/ / match digits:\ d "ad3ad2ad" .match (/\ dswag); / / ["3", "2"] / / matches any character except newline characters:. "a\ nb\ rc" .match (/. / g); / / ["a", "b", "c"] / / matches letters or numbers or underscores:\ w "a5kanji @!-=" .match (/\ wg) / / ["a", "5", "_"] / / match blanks:\ s "\ n\ r" .match (/\ sWeig); / / [",", "] the first result is\ n, and the last result is\ r how are you / match [the beginning or end of the word]:\ b" match ".match (/\ b\ wapg) / / ["h", "a", "y"] / / matches the position of [string start and end]: start ^ end $"how are you" .match (/ ^\ wUnig); / / ["h"]

Antisense metacharacters are written by capitalizing the upper lowercase letters, for example, matching all non-numeric characters:\ D.

There are also some metacharacters used to represent repetition, which are described in the following content.

Character range

Use a symbol in [], which can be used to represent a range of characters. Such as:

/ / match all letters between the letters amerz / [amurz] / / match all characters in Unicode between 0 and z / [0murz] / unicode Encoding query address: / / https://en.wikibooks.org/wiki/Unicode/Character_reference/0000-0FFF// according to the above, we can find that the Unicode coding range of Chinese characters is from\ u4E00 to\ u9FA5. So we can write a regular expression to determine whether there are Chinese characters / [\ u4E00 -\ u9FA5] / .test ("test") in a string. / / true

Repetition & greed and laziness

First of all, when we want to match some repetitive characters, we need to use some regular expressions related to repetition, as follows

/ / repeat n times {n} "test12" .match (/ test\ d {3} /); / / null "test123" .match (/ test\ d {3} /); / / ["test123"] / / repeat n or more times {n,} "test123" .match (/ test\ d {3,} /); / / ["test123"] / repeat n to m times "test12" .match (/ test\ d {3} /) / / null "test12345" .match (/ test\ d {3test 5} /); / / ["test12345"] "test12345678" .match (/ test\ d {3Power5} /); / / ["test12345"] / / the matching character test is followed by a number, which is repeated 0 or more times as "test" .match (/ test\ dmatch /); / / ["test"] "test123" .match (/ test\ dmatch /) / / ["test123"] / / repeat "test" .match (/ test\ dbath /); / / null "test1" .match (/ test\ dbath /); / / ["test1"] / / repeat one or 0 times "test" .match (/ test\ dbath /); / / null "test1" .match (/ test\ dbath /); / / ["test1"]

As you can see from the above results, when the number followed by the character test can be repeated 0 or more times, the substring captured by the regular expression returns as many numbers as possible, such as / test\ dstring / matching test123, which returns test123 instead of test or test12.

When a regular expression captures a string, it captures as many strings as possible if the condition is met, which is called the "greedy pattern".

The corresponding "lazy pattern" is to capture as few strings as possible if the conditions are satisfied. the way to use the lazy pattern is to add a "?" after the character repetition mark, which is written as follows.

/ / repeat the number 3 times 5 times, return as few digits as possible "test12345" .match (/ test\ d {3 test123 5}? /) if the condition is met; / / ["test123"] / / repeat the number one or more times, and return only one number "test12345" if the condition is met; / / [test1]

Character escape

Metacharacters have a special meaning in regular expressions. When we want to match metacharacters themselves, we need to use character escape, such as:

/\. / .test ("."); / / true

Grouping-bifurcation condition

Regular expressions can be grouped with "()", and regular expressions with grouping match not only the substring as a whole, but also the regular expression fragments in the grouping.

Grouping is based on nesting and antecedent relationships, and each group is assigned a numeric group number, which can be used in some scenarios.

Grouping can reflect different functions in replace, match, and exec functions.

In the replace function, the $+ numeric group number can be used in the second parameter to refer to the content of the grouping, such as:

"the best language in the world is java" .replace (/ (java) /, "$1script"); / / "the best language in the world is javascript"

"/ static/app1/js/index.js" .replace (/ (\ /\ w+)\ .js /, "$1-v0.0.1.js"); / / "/ static/app1/js/index-v0.0.1.js" (\ /\ w+) the grouping matches / index

Add the version number to the second parameter

In the match function, when a regular expression has a global attribute, all substrings that satisfy the regular expression are captured.

"abchellodefhellog" .match (/ h (ell) oplink g); / / ["hello", "hello"]

However, when a regular expression has no global attribute and there is a grouping in the regular expression, the match function only returns the first result of the entire regular expression match, and the string to which the grouping is matched is also placed in the result array:

"abchellodefhellog" .match (/ h (ell) o /); / / ["hello", "ell"] / / We can use the match function to decompose url to get protocol, host, path, query string and other information "http://www.baidu.com/test?t=5".match(/^((\w+):\/\/([\w\.]+))\/([^?]+)\?(\S+)$/);" / ["http://www.baidu.com/test?t=5"," http://www.baidu.com", "http", "www.baidu.com", "test", "tweak 5"]

In the case of grouping in a regular expression, the exec function behaves much like the match function, except that the exec function returns only one result regardless of whether the regular expression has a global attribute or not, and captures the grouped result.

/ h (ell) o/g.exec ("abchellodefhellog"); / / ["hello", "ell"]

Branching conditions can be used when regular expressions need to match several types of results, such as

"asdasd hi asdad hello asdasd" .replace (/ hi | hello/, "nihao"); / / "asdasd nihao asdad hello asdasd"asdasd hi asdad hello asdasd" .split (/ hi | hello/); / / ["asdasd", "asdad", "asdasd"]

Note that the branch condition affects everything on both sides of it, such as hi | hello matches hi or hello, not hiello or hhello

The branching condition in the group does not affect the content outside the group.

"abc acd bbc bcd" .match (/ (a | b) bc/g); / / ["abc", "bbc"]

Backward reference

The grouping of regular expressions can be referenced by a\ + numeric group number in the statement that follows.

such as

/ / match duplicate words / (\ b [a-zA-Z] +\ b)\ s +\ 1/.exec ("asd sf hello hello asd"); / / ["hello hello", "hello"]

Assertion

(?: exp), for a grouping defined in this way, the regular expression matches the contents of the grouping, but the group number is no longer assigned to the grouping, and the role of this grouping in functions such as replace, match, and so on will disappear. The effect is as follows:

/ (hello)\ sworld/.exec ("asdadasd hello world asdasd") / / ["hello world", "hello"], normally capture the result string and grouping string / (?: hello)\ sworld/.exec ("asdadasd hello world asdasd") / / ["hello world"] "/ static/app1/js/index.js" .replace (/ (\ /\ w+)\ .js /, "$1-v0.0.1.js") / "/ static/app1/js/index-v0.0.1.js"/ static/app1/js/index.js" .replace (/ (?:\ /\ w+)\ .js /, "$1-v0.0.1.js"); / / "/ static/app1/js$1-v0.0.1.js"

(? = exp) this grouping is used after the regular expression to capture the characters before the exp. The contents of the grouping are not captured and the group number is not assigned.

/ hello\ s (? = world) / .exec ("asdadasd hello world asdasd") / / ["hello"]

(?! exp), contrary to the previous assertion, is used after a regular expression to capture characters that are not followed by exp, nor does it capture the contents of the grouping or assign a group number.

/ hello\ s (?! world) / .exec ("asdadasd hello world asdasd") / / null

Processing option

There are three regular expressions supported by regular expressions in javascript, g, I, m, which represent global matching, ignoring case, and multiline patterns, respectively. The three attributes can be combined and coexisted freely.

/ / Global matching g "abchelloasdasdhelloasd" .match (/ hello/); / ["hello"] "abchelloasdasdhelloasd" .match (/ hello/g); / ["hello", "hello"] / / ignore uppercase I "abchelloasdasdHelloasd" .match (/ hello/g); / ["hello"] "abchelloasdasdHelloasd" .match (/ hello/gi); / / ["hello", "Hello"]

In the default mode, the metacharacters ^ and $match the beginning and end of the string, respectively, and the pattern m changes the definition of these two metacharacters to match the beginning and end of a line.

"aadasd\ nbasdc" .match (/ ^ [a murz] + $/ g); / / null string ^ and $have a newline character, which does not match [Amurz] +, so return null "aadasd\ nbasdc" .match (/ ^ [Amurz] + $/ gm) / / ["aadasd", "basdc"], change the meaning of ^ $to match the beginning and end of a line, and you can get two lines of results. These are all the contents of the article "how to use regular expressions in Javascript". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, 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.