Before reading the main text, let me introduce it to youBasic concepts of regular expressions:
Regular expressions, also known as regular representations and regular representations. (English: Regular Expression, often abbreviated as regex, regexp or RE in code), a concept of computer science. Regular expressions use a single string to describe and match a series of syntactic rules. In many text editors, regular expressions are usually used to retrieve and replace text that conforms to a certain pattern.
There are some regular expressions like me. After learning them several times, they are still confused. When I was learning them, I always understand them and forget everything after learning them. Well, in fact, I still don’t practice enough. As the saying goes, reviewing the old and learning the new can be a teacher. Today, let’s follow me to review this arrogant regular expression.
Why do we need regular expressions? Actually, it's because the computer is stupid (I didn't say this), for example123456@, At first glance, it is an email address, but the computer does not recognize it, so we have to use some languages that the computer knows to formulate rules and tell it that the email address that complies with this rule is an email address, so that the computer can help us find the corresponding things. So the rules are used to set rules to complete some of the operations we need, such as login verification, searching for specified things, etc. Too much is redundant, just look at the topic.
Define the regularity:
1 var re = new RegExp(“a”); //RegExp object. Parameters are the rules we want to make. There is a situation that must be used in this way, which will be mentioned below.2 var re = /a/; // Abbreviation method Recommended use Better performance Can't be empty Otherwise, I think it's a comment ,
Common methods of regularity
1 test(): Find content that conforms to the regularity in the string. If it is found, it returns true, otherwise it returns false.
Usage: regular.test(string)
Example: Determine whether it is a number
var str = '374829348791'; var re = /\D/; // \D stands for non-numberif( (str) ){ // Return true, which means that a non-number was found in the string.alert('Not all numbers'); }else{ alert('It's all numbers'); }
There are many symbols in regular expressions that represent different meanings and are used to define different rules, such as the above \D and the following:
\s : Space
\S: Non-space
\d : Number
\D : Non-digital
\w : Characters (letters, numbers, underscore_ )
\W : Non-character example: Is there a character that is not a number
(The following will talk about some commonly used characters in sequence based on the examples, and finally summarize them.)
2 search(): Search for content that conforms to the regularity in a string. When searching, it returns the position it appears (starting from 0, if the match is not just one letter, it will only return the position of the first letter). If the search fails, it returns -1
Usage: string.search(regular)
Find the contents of a compound regular in a string. Ignore case: i-ignore (the default is case-sensitive in the regular. If case-insensitive, add the flag i at the end of the regular)
Example: Find the letter b in a string, and is case-insensitive
var str = 'abcdef'; var re = /B/i; //var re = new RegExp('B','i'); It can also be written like thisalert( (re) ); // 1
3 match() Search for the content of the compound rule in a string. If the search is successful, the content will be returned. The format is an array, and if the failure is successful, the content will be returned.
Usage: string.match(regular)
Quantifier: + appears at least once. The number of times the match is uncertain (match means search and search)
Global Match: g-g-global (default in the regular, the search will end as long as the content of the compound rule is searched)
Example: Find all numbers in the specified format, as follows: 123, 54, 33, 879
var str = 'haj123sdk54hask33dkhalsd879';
var re = /\d+/g; // At least one number is matched at a time and global match If it is not a global match, when the number 123 is found, it will stop. It will only pop up 123. Add global matching and search for those that meet the rules from the beginning to the end. If there is no plus sign, the matching result is 1, 2, 3, 5, 4, 3, 3, 879 is not what we want. With the plus sign, each matching number will be at least one.
alert( (re) ); // [123,54,33,879]
4 replace(): Find a string that conforms to the regularity and replace it with the corresponding string. Returns the replaced content.
Usage: String.replace (regular, new string/callback function) (In the callback function, the first parameter refers to the character that matches successfully every time)
| : or means .
Example: sensitive word filtering, such as I love Beijing * Square, and the sun rises on * Square. ------I love *****, the sun rises on ****. That is, Beijing and * Square become *,
At first we might think of something like this:
var str = "I love * Square in Beijing, and the sun rises on * Square."; var re = /Beijing|* Square/g; // Find Beijing or * Global Matchvar str2 = (re,'*'); alert(str2) //I love **, *The sun rises//This just turns the found one into one*,It doesn't matter how many words correspond to*。
To implement several words corresponding to several *, we can use the callback function to implement it:
var str = "I love * Square in Beijing, and the sun rises on * Square."; var re = /Beijing|* Square/g; // Find Beijing or * Global Matchvar str2 = (re,function(str){ alert(str); // Used to test: The first parameter of the function represents the regular characters found each time, so the first str refers to Beijing. The second str is *. The third str is *.var result = ''; for(var i=0;i<;i++){ result += '*'; } return result; //So after searching for a few words, you will return a few*}); alert(str2) //I love*****,***The sun rises
//The whole process is to find Beijing, replace it with two *, find * Square and replace it with 3 *, find * Square and replace it with 3 *.
replace is a very useful method and is often used.
Characters in regular
():, brackets are called grouping characters. It is equivalent to brackets in mathematics. as follows:
var str = '2013-6-7'; var re1 = /\d-+/g; // Global matching numbers, horizontal bars, and horizontal bars are at least 1, and the matching result is: 3- 6-var re1 = /(\d-)+/g; // Global matching numbers, bars, numbers and bars are at least 1 3-6-var re2 = /(\d+)(-)/g; // Globally match at least one number,Match a horizontal bar Match results:2013- 6-
At the same time, every item with brackets in the regular is called a child of this regular. Children are very useful at some point, for example, let’s take a look at a chestnut.
Example: Let 2013-6-7 become 2013.6.7
var str = '2013-6-7'; var re = /(\d+)(-)/g; str = (re,function($0,$1,$2){ //If there is a child in replace(), //The first parameter: $0 (the overall result after successful match 2013-6-),// The second parameter: $1 (the first group matched successfully, which refers to \d 2013, 6)//The third parameter: $1 (the second group that matches successfully, here refers to - - - )return $1 + '.'; //Return to 2013 respectively. 6.}); alert( str ); //2013.6.7 //The whole process is to use the child item2013- 6- Replaced with2013. 6. Finally popped up2013.6.7
The match method will also return its own child, as follows:
var str = 'abc'; var re = /(a)(b)(c)/; alert( (re) ); //[abc,a,b,c]( Returns the matching result and each child whenmatchNo additiongOnly when the child items can be obtained)
[]: Represents any one of a set, for example, [abc] represents a character in the whole, matching any one of a b c, or it can be a range, [0-9] range must be from small to large.
[^a] The whole represents a character: If written in [], it means exclusion
Example: Match HTML tags, for example <div class="b">hahah </div> Find the tags <div class="b"></div>
var re = /<[^>]+>/g; //Match the content of at least one non-close bracket in the middle (because there are some attributes and other things in the label), and then match the closing bracket
var re = /<[\w\W]+>/g; //Match the left bracket. At least one character or non-character content in the middle, and then match the closing bracket.// In fact, it is to find the opening bracket, and then there can be at least one content in the middle. Until the closing bracket is found, it means that it is a label.
Escape characters
\s : Space
\S: Non-space
\d : Number
\D : Non-digital
\w : Characters (letters, numbers, underscore_ )
\W : Non-character
.(dot) - any character
\. : The real point
\b : Independent parts (start, end, space)
\B : Non-independent part
Let’s see a look at the last two:
var str = 'onetwo'; var str2 ="one two"; var re = /one\b/; // E must be independent after it. It can be a start, space, or endalert( (str) ); //false alert( (str2) );//true
Example: Write a function that uses class name to get a node:
We may have seen a function like this before:
function getByClass(parent,classname){ if(){ return (classname); } else{ var results = new Array();// Used to store all elements with the retrieved class boxvar elems = ("*"); for(var i =0;i<;i++){ if(elems[i].className==classname){ (elems[i]); } } return results; } }
In fact, there is a problem. For example, if there are two classes in a tag, or classes with the same name exist, such as <div class="box1 box1">, <div class="box1 box2>, it cannot be obtained. We can use regularity to solve this problem.
function getByClass(parent,classname){ if(){ return (classname); }else{ var arr = []; var aEle = ('*'); //var re = /\bclassname\b/; //This cannot be written in this way. When the regular parameter needs to be used, you must use the full name to write it. The abbreviation method will match classname as a string.var re = new RegExp('\\b'+classname+'\\b'); // When matching, the classname must be preceded by a start or space, and the same is followed. The default match will stop if it is successful, so even if there are duplicates, it will not match again.//It should be noted that when the full name declares regularity, the parameters are of string type, so when we use it, we need to ensure that these special characters can also be output within the string. \b itself is a special character and cannot be output in a string, so you need to add a backslash to escape.for(var i=0;i<;i++){ if( (aEle[i].className) ){ ( aEle[i] ); } } return arr; } }
\a represents a duplicate child item, for example:
\1 The first child that repeats
\2 The second child that repeats
/ (a) (b) (c) \1/-----------------------------------------------------------------------------------------------------------------
/ (a) (b) (c) \2/-----------------------------------------------------------------------------------------------------------------
Example (often asked in interview questions): Find the number of characters with the most duplicates
split(): Method in string, convert the string into an array.
sort(): The sort method in the array, sorted according to the ACALL code.
join(): Method in an array, converting an array into a string
var str = 'assssjdssskssalsssdkjsssdss'; var arr = (''); //Convert string to arraystr = ().join(''); //Sort first, so that the result will put the same characters together and then convert them to strings//alert(str); // aaddjjkklsssssssssssssssss var value = ''; var index = 0; var re = /(\w)\1+/g; //Match the character and repeat the character at least once.(re,function($0,$1){ //alert($0); represents the result of each match successfully: aa dd jj kk l sssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss//alert($1); represents the first child that succeeds in each match, that is, \w: a d j k l S if(index<$){ //If the value saved by index is less than $0, perform the following operationindex = $; // In this way, the index is kept at the maximum lengthvalue = $1; //The value saves the character with the most occurrences} }); alert('The most characters:'+value+',Repeat times:'+index); // s 17
Quantifier: represents the number of occurrences
{n,m}: At least n times, up to m times
{n,} : At least n times
* :Any times equivalent to {0,}
? : Zero or once equivalent to {0,1}
+ : Once or any time is equivalent to {1,}
{n}: exactly n times
Example: Determine whether it is a QQ number
//^ : Putting it in the beginning position of the regular means starting. Note that /[^a] / and /^[a]/ are different. The former means exclusion, and the latter means first.
//$ : The last position of the regular, which means the end
//First think about the rules of QQ number
1 The first position cannot be 0
2 must be 5-12 digits
var aInput = ('input'); var re = /^[1-9]\d{4,11}$/; //123456abc In order to prevent such a situation, it is necessary to limit the final//The first digit is 0-9, followed by the digit type of 4-11 digits.aInput[1].onclick = function(){ if( (aInput[0].value) ){ alert('It's a QQ number'); }else{ alert('Not a QQ number'); } };
Example: Remove the spaces before and after (interview questions often appear)
var str = ' hello '; alert( '('+trim(str)+')' );//Parcels are added to see the difference. (hello)function trim(str){ var re = /^\s+|\s+$/g; // | represents or \s represents space + at least one space before or at least one space after and matches globallyreturn (re,''); //Replace space with empty}
Some commonly used form verification
Match Chinese: [\u4e00-\u9fa5] //The range of Chinese ACALL code
The end spaces of the first line: ^\s*|\s*$ //Any space appears in the first line or any space appears in the last line (any representation can also be without spaces)
Email:^\w+@[a-z0-9]+(\.[a-z]+){1,3}$
//The beginning is at least one character (\w letter, number or underscore), then match @, then any letter or number, \. represents the real point, followed by at least one character (a-z), and at the same time, this (such as .com) is a child as the end, and can appear 1-3 times. Because some email addresses are like this. (xxxx.@
xxxx.@ xxxx.@ )
Website: [a-zA-z]+://[^\s]* http://......
//Match any letters that are not case-specific, followed by //, followed by any character with non-spaces
Postal code: [1-9]\d{5} //The starting number cannot be 0, then 5 numbers
ID card: [1-9]\d{14}|[1-9]\d{17}|[1-9]\d{16}x
For convenience and no conflict, we can use json format to create our own space, as follows:
/* var re = { email : /^\w+@[a-z0-9]+(\.[a-z]+){1,3}$/, number : /\d+/ }; */
The above is a summary of common usages of regular expressions introduced to you by the editor. If you have any questions, please leave me a message and the editor will reply to you in time. Thank you very much for your support for my website!