preface
When we do not learn regular, we think it is very difficult to learn regular because of its powerful function. But you’ll find that it only takes you a few hours to become proficient with regex. Before we look at regular expressions, let’s look at a few questions: 1. What is a regular expression? 2. What are the usage scenarios of regular expressions? 3. What are the common methods for regular expressions? 4. What are the common syntax rules for regular expressions? “And then read the text with questions. This article is to learn the regular process of the need to use the site and regular grammar rules are summarized and summarized, but also hope to help the need to learn regular partners.
First, the concept of regular expressions
Definition: A Regular Expression is a pattern used to describe a set of character strings that match a particular string. Simply put, it’s a rule for matching a particular string
Regex Tutorial
A web site with a common reany-rule
2. Usage scenarios of regular expressions
1. Determine whether a specific string conforms to the regular rule
For example, check whether https://juejin.cn/ stocking, http://juejin.cn/ *, and https://juejin.com/ * are gold mining sites
let siteReg = /^https\:\/\/juejin.cn\//
let resultA = siteReg.test('https://juejin.cn/')
let resultB = siteReg.test('http://juejin.cn/')
let resultC = siteReg.test('https://juejin.com/')
// Three different formats of the site can match
console.log(resultA, resultB, resultC) // true false false
Copy the code2. Replace the string matched by the re with the specified string
For example, replace juejin in http://juejin.cn/, https://juejin.com/, and https://juejin.cn/ with Baidu
let resultA = 'https://juejin.cn/'.replace(siteReg, 'baidu')
let resultB = 'http://juejin.cn/'.replace(siteReg, 'baidu')
let resultC = 'https://juejin.com/'.replace(siteReg, 'baidu')
// -> https://baidu.cn/ http://baidu.cn/ https://baidu.com/
console.log(resultA, resultB, resultC)
Copy the code3. Regular expressions can be used
1. String methods use re
① The search method returns the position matched to the string.
let searchStr = 'hello world'
let result = searchStr.search(/o/g)
console.log(result) / / - > 4
Copy the code② Use the method to extract matches from strings. Match ()
Returns an array of matched strings
let extractStr = "Extract the word 'coding' from this string."
let codingRegex = /coding/
let result = extractStr.match(codingRegex)
console.log(JSON.stringify(result)) // -> ["coding"]
Copy the code③ Use capture groups to search and replace —.replace()
You can use the.replace() method on a string to search for and replace the text in the string. The input to.replace() begins with the regular expression matching pattern you want to search for. The second argument is a string to replace the match or a function to perform some operation.
let wrongText = 'The sky is silver.'
let silverRegex = /silver/
let result = wrongText.replace(silverRegex, 'blue')
console.log(result) // -> The sky is blue.
// Use the dollar sign ($) to access the capture group in the replacement string.
let result1 = 'Code Camp'.replace(/(\w+)\s(\w+)/.'$2 $1')
console.log(result1) // -> Camp Code
Copy the code2. Method use on re
① Use the regular test method. Test ()
** Regular expressions use the test method to verify that a character meets the regular expression’s verification criteria. Returns true if the character meets the regular expression’s verification criteria, and false if the character does not.
let testStr = "hello";
let testRegex = /hello/;
let result = testRegex.test(testStr);
console.log(result) // -> true
Copy the code② Use the method of extracting matching items on the re. Exec ()
Unlike the match method, in global matching mode, the exec() method matches only one result at a time, but changes the position of the next match after each match
var codingRegex = /coding/g
var codingStr =
'Extract the word "coding" from this string and get "coding".'
var resultA = codingRegex.exec(codingStr)
var resultB = codingRegex.exec(codingStr)
// ['coding', index: 18, input: 'Extract the word "coding" from this string and get "coding".', groups: undefined]
console.log(resultA)
// ['coding', index: 52, input: 'Extract the word "coding" from this string and get "coding".', groups: undefined]
console.log(resultB)
Copy the codeFour, regular check rules – common
1. Match position
| metacharacters | describe |
|---|---|
| ^ | Matches the beginning of the input line |
| $ | Matches the end of the input line |
2. Character sets[]
| metacharacters | describe |
|---|---|
[xyz] |
Collection of characters. Matches any of the contained characters. |
[^xyz] |
A collection of negative characters. Matches any character that is not contained. |
| [a-z], [0-9] | Character range. Matches any character in the specified range. |
[^a-z],[^ 0-9] |
The range of negative characters. Matches any character that is not in the specified range. |
3, quantifiers
| metacharacters | describe |
|---|---|
| {n} | N is a non-negative integer. Match certain n times. |
| {n,} | N is a non-negative integer. At least n times. |
| {n,m} | Both m and n are non-negative integers, where n<=m. At least n times and at most m times are matched. |
| * | Matches the preceding subexpression any number of times. |
| + | Match the preceding subexpression once or more (once or more). |
| ? | Matches the preceding subexpression zero or once. |
| *? | Repeat as many times as you want, but as few times as possible |
| +? | Repeat 1 or more times, but as little as possible |
| ?? | Repeat 0 or 1 times, but as little as possible |
| {n,m}? | Repeat n to m times, but as few as possible |
4. Set of common characters
| metacharacters | describe |
|---|---|
| \d | Matches a numeric character. Equivalent to [0-9]. |
| \D | Matches a non-numeric character. Is equivalent to[^ 0-9]. |
| \s | Matches any invisible character, including Spaces, tabs, page feeds, and so on. Equivalent to [\f\n\r\t\v]. |
| \S | Matches any visible character. Is equivalent to[^ \f\n\r\t\v]. |
| \w | Matches any word character including underscores. Similar but not equivalent to[A-Za-z0-9_] |
| \W | Matches any non-word character. Is equivalent to[^A-Za-z0-9_]. |
| . | Any character except newline |
5. Whitespace characters
| metacharacters | describe |
|---|---|
| \f | Matches a feed character. |
| \n | Matches a newline character. |
| \r | Matches a carriage return. |
| \t | Matches a TAB character. |
| \v | Matches a vertical TAB character. |
6. Modifiers
| The modifier | describe |
|---|---|
| i | Ignore case insensitive |
| g | Global matching |
7. Predicate first
| metacharacters | describe |
|---|---|
| A(? =assert) | Predicate: Query A before assert |
| A(? ! assert) | Predicate: The query is not A before Assert |
8. Group matching(a)
| metacharacters | describe |
|---|---|
| ( ) | Define the expression between (and) as a “group,” and store the characters matching the expression in a temporary area (up to nine in a regular expression) that can be referenced with \1 through \9 symbols. |
| (pattern) | Matches pattern and gets the match. A maximum of 9 matches can be saved by using \1 \2… 9 \ to reference |
| (? :pattern) | Does not get a match, matches pattern but does not get a match result. |
Five, regular check rules – detailed explanation
1. The basic rules of regular expressions//
Definition: A Regular Expression is a pattern used to describe a set of character strings that match a particular string.
2. Regular expression or —|
** Definition: ** matches multiple rules, which can be done by adding more matching patterns. These patterns will contain more OR operator to separate them, such as/yes | no | strategized /.
let petString = "James has a pet cat.";
/ / when matching string contains dog | | cat bird | fish this a few field returns true
let petRegex = /dog|cat|bird|fish/;
let result = petRegex.test(petString);
console.log(result) // true
Copy the code3. Ignore case when matching regular expressionsi
let myString = "freeCodeCamp";
let fccRegex = /freecodecamp/i;
let result = fccRegex.test(myString);
console.log(result) // true
Copy the code4. Regular expression global matchingg
let twinkleStar = "Twinkle, twinkle, little star";
let starRegex = /twinkle/gi;
let result = twinkleStar.match(starRegex);
console.log(JSON.stringify(result)) // -> ["Twinkle","twinkle"]
Copy the code5, match all characters.
let exampleStr = "Let's have fun with regular expressions!"
let unRegex = /.un/
let result = exampleStr.match(unRegex)
console.log(JSON.stringify(result)) // -> ["fun"]
Copy the code6, match the specified multiple characters —[]
let quoteSample = 'Beware of bugs in the above code; I have only proved it correct, not tried it.'
let vowelRegex = /[aeiou]/gi
let result = quoteSample.match(vowelRegex)
console.log(JSON.stringify(result))
Copy the code1, match the letters of the alphabet — [a-e]
let quoteSample = 'The quick brown fox jumps over the lazy dog.'
let alphabetRegex = /[a-z]/gi
let result = quoteSample.match(alphabetRegex)
console.log(JSON.stringify(result))
Copy the code2, match the number from 0 to 9 — [0-9]
let jennyStr = '8675309'
let myRegex = /[0-9]/gi
let result = jennyStr.match(myRegex)
console.log(JSON.stringify(result)) / / - > [" 8 ", "6", "7", "5", "3", "0" and "9"]
Copy the code7, match a single unspecified character —^
To create a negative character set, place the off character (that is ^) after the opening parenthesis and before the character you do not want to match. Operator,! , [, @, /, and whitespace characters are also matched.
let quoteSample = "3 blind mice.";
let myRegex = /[^aeiou0-9]/gi;
let result = quoteSample.match(myRegex);
[""."b"."l"."n"."d".""."m"."c"."."]
Copy the code8. Matches characters that appear once or more times in a row —+
let difficultSpelling = 'Mississippi'
let myRegex = /s+/g // Modify this line
let result = difficultSpelling.match(myRegex)
console.log(JSON.stringify(result)) // -> ["ss","ssssssssss"]
Copy the code9, match zero or more occurrences of the character — *
let soccerWord = "gooooooooal!";
let gPhrase = "gut feeling";
let oPhrase = "over the moon";
let goRegex = /go*/;
soccerWord.match(goRegex); // -> ["goooooooo"]
gPhrase.match(goRegex); // -> ["g"]
oPhrase.match(goRegex); // -> null
Copy the code10, lazy matching, need to cooperate+or*Using the —?
In regular expressions, the greedy match matches the longest possible part of the string that matches the regular expression matching pattern and returns it as a match, which is also the default rule for regular matching. Another scheme, called lazy matching, matches to the smallest possible part of the string that satisfies the regular expression. Use? Character to turn it into a lazy match.
let text = 'tlitanic'
let myRegex = /t[a-z]*i/
let myRegex1 = /t[a-z]*? i/
let result = text.match(myRegex)
let result1 = text.match(myRegex1)
console.log(JSON.stringify(result)) // -> ["tlitani"]
console.log(JSON.stringify(result1)) // -> ["tli"]
Copy the code11. Match with or without characters —?
A matching pattern can be used if it has parts that it is not certain exist?matching
let american = "color";
let british = "colour";
let rainbowRegex= /colou? r/;
// The u in the character pass is indeterminate, and will be matched successfully regardless of whether there is or is not
rainbowRegex.test(american); // true
rainbowRegex.test(british); // true
Copy the codeMatches the beginning of the string —^
let rickyAndCal = 'Cal and Ricky both like racing.'
let calRegex = /^Cal/ // Modify this line
let result = calRegex.test(rickyAndCal)
console.log(result) // -> true
Copy the code13. Match the end of the string —$
let caboose = "The last car on a train is the caboose";
let lastRegex = /caboose$/; // Modify this line
let result = lastRegex.test(caboose);
console.log(result) // -> true
Copy the codeWhen ^ and
Content between
let specialSymbol = /^code$/
let result = specialSymbol.test('code')
console.log(result) // -> true
Copy the code14. Match all letters, numbers, and underscores\w
The closest metacharacter to an alphabet match in JavaScript is \w. This abbreviation is equivalent to [A-zA-Z0-9_]. This character class matches uppercase and lowercase letters as well as numbers. Note that this character class also contains the underscore character (_).
let quoteSample = 'The five'
let alphabetRegexV2 = /\w/g // Modify this line
let result = quoteSample.match(alphabetRegexV2)
console.log(JSON.stringify(result))
// -> ['T', 'h', 'e', 'f', 'i', 'v', 'e']
Copy the code15. Matches all symbols except letters and numbers\W
\W searches for matching patterns contrary to \W. Note that the matching pattern uses uppercase letters instead. This abbreviation is the same as [^ A-zA-z0-9_].
let shortHand = /\W/;
let numbers = "42%";
let sentence = "Coding!";
numbers.match(shortHand); / / - > [' % ']
sentence.match(shortHand); / / - > ['!]
Copy the code16, Match all numbers —\d
The abbreviation for finding numeric characters is \d, note the lowercase D. This is equivalent to the metacharacter [0-9], which looks for a single character of any number between 0 and 9.
let movieName = '2001: A Space Odyssey'
let numRegex = /\d/g // Modify this line
let result = movieName.match(numRegex)
console.log(result) // -> ['2', '0', '0', '1']
Copy the code17. Match all non-numbers —\D
The abbreviation for finding non-numeric characters is \D. This is equivalent to the string [^0-9], which looks for a single character that is not a number between 0 and 9.
let movieName = '2001: A Space Odyssey'
let noNumRegex = /\D/g // Modify this line
let result = movieName.match(noNumRegex)
console.log(result)
// -> [':', ' ', 'A', ' ', 'S', 'p', 'a', 'c', 'e', ' ', 'O', 'd', 'y', 's', 's', 'e', 'y']
Copy the code18, match whitespace character —\s
You can search for Spaces using \s, where s is lowercase.
let sample = 'Whitespace is important in separating words'
let countWhiteSpace = /\s/g // Modify this line
let result = sample.match(countWhiteSpace)
console.log(JSON.stringify(result)) // -> [" "," "," "," "," "]
Copy the code19. Match non-whitespace characters —\S
Use \S to search for non-whitespace characters, where S is uppercase. This matching pattern will not match Spaces, carriage returns, tabs, page feeds, and line feeds.
let sample = 'Whitespace is'
let countWhiteSpace = /\S/g // Modify this line
let result = sample.match(countWhiteSpace)
console.log(JSON.stringify(result)) // -> ["W","h","i","t","e","s","p","a","c","e","i","s"]
Copy the code20. Escape characters — keywords\
/ / match
let specialSymbol = / ^ / / /
let result = specialSymbol.test('/specialSymbol')
console.log(result) // -> true
Copy the code21, Match mixed character group —(a)
et testStr = "Pumpkin";
let testRegex = /P(engu|umpk)in/;
testRegex.test('Pumpkin'); // true
testRegex.test('Penguin'); // true
Copy the code22, specify the upper limit and lower limit of matching{}
Quantity specifiers specify the upper and lower limits of matching patterns. The quantity specifier is used with curly braces ({and}). You can place two numbers between curly braces that represent the upper and lower limits of the matching pattern.
let multipleA = H / / a {3, 5};
multipleA.test("aaaaah"); // -> true
multipleA.test("aaah"); // -> true
multipleA.test("aah"); // -> false
let multipleB = /a{3,}h/; // Specify only the lower limit of matching
multipleB.test("aaaaah"); // -> true
multipleB.test("aaah"); // -> true
multipleBtest("aah"); // -> false
let multipleC = /a{3}h/; // Specify only the exact number that matches
multipleC.test("aaaaah"); // -> false
multipleC.test("aaah"); // -> true
multipleC.test("aah"); // -> false
Copy the codePositive antecedent assertion and negative antecedent assertion —(? =)... 和(? ! ...).
Forward-ahead assertions look to ensure that elements in the search match pattern exist, but there is no match. The use of forward antecedent assertions is (? =)… , including… The part that needs to exist but won’t be matched.
Negative prior assertions, on the other hand, look to ensure that elements in the search match pattern do not exist. Negative antecedent assertions are used (? ! …). , including… It’s a matching pattern that I hope doesn’t exist. If the negative leading assertion part does not exist, the rest of the matching pattern is returned.
let quit = "qu";
let noquit = "qt";
let quRegex= /q(? =u)/;
let qRegex = /q(? ! u)/;
quit.match(quRegex); // -> ["q"]
noquit.match(qRegex); // -> ["q"]
Copy the code24, Use capture group reuse pattern —\ 1
Regular expressions can be divided into groups by (), with each group matching several characters independently. The substring of the group matching is saved to a temporary “variable”, which can be accessed using the same regular expression and backslash and capture group number (e.g. : \1). Capture groups are automatically numbered (left to right) by their opening bracket position, starting at 1 and up to 9.
let repeatNum = "42 42 42";
/ / / ^ (\ d {2, 3}) 1 \ s \ s \ \ 1 $/ = = ^ (\ d {2, 3}) \ s \ \ s (\ d {2, 3})/(\ d {2, 3}) $/
let reRegex = / ^ (\ d {2, 3}) \ s \ \ s \ 1 $/; // (\d{2,3}) this rule is the variable numbered 1
let result = reRegex.test(repeatNum);
console.log(result) // -> true
Copy the code