Directory
- Chapter II-02: Before the correct expression Magic (middle)---capturing group, reverse reference
- First, predefined character classes
- Second, group
- Third, or operator
- Four, reverse reference
- 4-1 capturing groups
- 4-2 Reverse Reference
Chapter II-02: Before the correct expression Magic (middle)---capturing group, reverse reference
From: "JavaScript ninja Cheats"
Front End Road Series continue to talk about regular expressions!
First, predefined character classes
Represents a character set that matches a class, provided by the syntax of a regular expression. As follows:
pre-scheduled terms |
Match Content |
. |
Match any character outside of the new line \ n |
|
|
\s |
White space characters |
\s |
Non-whitespace characters |
|
|
\w |
A character that can form a word |
\w |
Characters that cannot form a word |
|
|
\d |
Digital |
\d |
Non-digital |
|
|
\b |
The boundary of a word |
\b |
is not the boundary of a word |
|
|
\ t |
Horizontal tab |
\v |
Vertical tab |
\f |
Page break |
\ r |
Carriage return character |
\ n |
Line break |
|
|
\CA: \cz |
controls, such as \CM, match a ctrl+m |
\x0000: \XFFFF |
Hexadecimal Unicode code |
\x00: \xff |
Hexadecimal ASCII code |
Below, we will write a small Demo according to the table above
1-1: Meaning of "."
All characters except spaces and line breaks eg:
var reg = /./gvar str = 'x'var str2 = 123var str3 = ' 'var str4 = '\n'var str5 = '\r'var res = reg.test(str) // truevar res2 = reg.test(str2) // truevar res3 = reg.test(str3) // falsevar res4 = reg.test(str4) // falsevar res5 = reg.test(str5) // false
1-2: The meaning of "\s"
Match white space character (space) eg:
var reg = /\s/gvar str = 'x'var str2 = ' 'var str3 = '\n'var str4 = '\r'var str5 = '\r\n'var res = reg.test(str) // falsevar res2 = reg.test(str2) // truevar res3 = reg.test(str3) // falsevar res4 = reg.test(str4) // truevar res5 = reg.test(str5) // true// 又疑惑了 ???// 无法解释? n 代表 newLine 新行, r 代表 return 换行// 只能这么解释了,newline 是因为这一行写满了没有空白了, return 是强行换行,所以一定是有空白的。
1-3: The meaning of "\s"
Match non-whitespace characters (space) eg:
var reg = /\S/gvar str = 'x'var str2 = ' 'var res = reg.test(str) // truevar res2 = reg.test(str2) // false
1-4: The meaning of "\w"
Match the character (world) that can form the word (match letters, numbers, underscores) eg:
var reg = /\w/gvar str = 'age'var str2 = 'a1ge'var str3 = 'a ge'var str4 = 'a&ge'var str5 = 123var res = reg.test(str) // truevar res2 = reg.test(str2) // truevar res3 = reg.test(str3) // truevar res4 = reg.test(str4) // truevar res5 = reg.test(str5) // falsevar arr = [res,res2,res3,res4,res5]for(let i = 0; i<arr.length; i++) { console.log(arr[i])}
1-5: The meaning of "\w"
Matches a character that does not make a word (world) eg:
var reg = /\W/gvar str = 'age'var str2 = 'a1ge'var str3 = 'a ge'var str4 = 'a&ge'var str5 = 123var res = reg.test(str) // falsevar res2 = reg.test(str2) // falsevar res3 = reg.test(str3) // truevar res4 = reg.test(str4) // falsevar res5 = reg.test(str5) // falsevar arr = [res,res2,res3,res4,res5]for(let i = 0; i<arr.length; i++) { console.log(arr[i])}// 有疑惑 为啥呢?// str3 中出现了空格 确实不能组成单词
1-6: The meaning of "\d"
Match number (digit) eg:
var reg = /\d/gvar str = 123var str2 = 'xxx'var res = reg.test(str) // truevar res2 = reg.test(str2) // false
1-7: The meaning of "\d"
Match non-digital (Digit) Eg:
var reg = /\D/gvar str = 123var str2 = 'xxx'var res = reg.test(str) // falsevar res2 = reg.test(str2) // true
1-7: The meaning of "\b"
Match word boundaries (boundary) (Letters, numbers, underscores) eg:
var reg = /\b/gvar str = 123var str2 = '@'var str3 = '_'var str4 = '&'var str5 = 'xxx'var res = reg.test(str) // truevar res2 = reg.test(str2) // falsevar res3 = reg.test(str3) // truevar res4 = reg.test(str4) // falsevar res5 = reg.test(str5) // true
1-8: The meaning of "\b"
Match a non-word boundary (boundary) eg:
var reg = /\B/gvar str = 123var str2 = '@'var str3 = '_'var str4 = '&'var str5 = 'xxx'var res = reg.test(str) // truevar res2 = reg.test(str2) // truevar res3 = reg.test(str3) // falsevar res4 = reg.test(str4) // truevar res5 = reg.test(str5) // true
Second, group
If you want to apply an operator to a set of strings, you can use (), which is the concept of grouping.
For example (ab)+
, a match is one or more string AB
When grouping with parentheses, a so-called捕获(capture)
Let's give an example to illustrate:
eg
// demo-1var reg = /(ab)+/gvar str = 'bababababbababababaaabbb'var res = str.match(reg) // ["abababab", "abababab", "ab"]// demo-2var reg = /(ab)/gvar str = 'bababababbababababaaabbb'var res = str.match(reg) // ["ab", "ab", "ab", "ab", "ab", "ab", "ab", "ab", "ab"]
Greed matches strings that conform to the AB * N rule consecutively
Third, or operator
A relationship, such as a a|b, that matches a or B character.
eg
// demovar reg = /a|b/gvar str = 'abcd'var str2 = 'aabbccdd'var res = str.match(reg) // ["a", "b"]var res2 = str2.match(reg) // ["a", "a", "b", "b"]
Four, reverse reference
A reverse reference to a capture defined in a regular expression refers to the 将捕获作为正则表达式中能够成功匹配术语时的候选字符串
term notation that is appended to the backslash followed by a number of captures to be referenced.
eg
var str = '<p>1</p>'var str2 = '<strong>2</strong>'var reg = /<(\w+)>(.+)<\/\1>/var res = str.match(reg)var res2 = str2.match(reg)
Or is there doubt? Why is it?
Often a definition can not be understood, it can only be understood in exchange for understanding the way that these cannot be understood.
Another special explanation:
捕获组捕获到的内容,不仅可以在正则表达式外部通过程序进行引用,也可以在正则表达式内部进行引用,这种引用方式就是反向引用。
One more question: 捕获组
What does it mean?
4-1 capturing groups
What is a capturing group?
A capturing group is a regular expression that matches a neutron expression 内容
, and is saved in a group in memory or in a 数字编号
显式命名
convenient later reference. Of course, such a reference can be either inside the regular expression or outside the regular expression.
There are two forms of a capturing group, one is a normal capture group, the other is a named capturing group, and the capturing group is usually referred to as a normal capturing group. The syntax is as follows:
Normal capturing group:(Expression)
Named capturing group:(?<name>Expression)
Demo-1 Common Capturing group:
var str = "2018-08-30"var generalReg = /(\d{4})-(\d{2})-(\d\d)/gvar res = str.match(generalReg) // ["2018-08-30"]
In the example above, it is clear in the expression that the capturing group, number, etc.
numbering |
naming |
Capturing groups |
Match Content |
0 |
|
(\d{4})-(\d{2})-(\d\d)) |
2018-08-30 |
1 |
|
(\d{4}) |
2018 |
2 |
|
(\d{2}) |
08 |
3 |
|
(\d\d) |
30 |
Demo-2 named capturing group:
var str = "2018-08-30"var generalReg = /(?<year>\d{4})-(?<date>\d{2})-(?<day>\d\d)/gvar res = str.match(generalReg) // ["2018-08-30"]
In the example above, it is clear in the expression that the capturing group, number, etc.
numbering |
naming |
Capturing groups |
Match Content |
0 |
|
(\d{4})-(\d{2})-(\d\d)) |
2018-08-30 |
1 |
Year |
(\d{4}) |
2018 |
2 |
Date |
(\d{2}) |
08 |
3 |
Day |
(\d\d) |
30 |
4-2 Reverse Reference
In a regular expression, a reference to the content captured by the preceding capturing group is referred to as a reverse reference;
We'll do a Demo with the above content:
var str = 'abcdebbcde'var reg = /([ab])/gvar res = reg.test(str) // truevar res0 = str.match(reg) // ['bb']var reg2 = /([ab])\2/gvar res2 = reg2.test(str) // falsevar res3 = str.match(reg2) // nullvar strs = 'abcdbaabbccde'var reg3 = /([ab])([a])\2/gvar res3 = reg3.test(strs)var res4 = strs.match(reg3) // ["baa"]
One more demo.
var str = '<div><p>1</p><strong>2</strong><div>'var reg = /<(\w+)>(.+)<(\/\1)>?/gvar res = str.match(reg) // ["<p>1</p>", "<strong>2</strong>"]
Is there a more understanding of the reverse reference?
反向引用
In the actual use of the scene or more, but also a more important concept, I hope to feel deeply.
Today on the regular expression of the introduction of the first here, Shenzhen in recent days are heavy rains, home from work ~ Remember to bring an umbrella OH
GitHub Address: (Welcome star, welcome recommendation:)
Pre-correct expression magic (middle)