# Dry goods | regular application (actual combat summary)

2021-08-27 10:07:06

See everyone playing Nuggets I also github Copy and send an article If useful Support a lot

# Regular applications ( summary )

Common business ( user name , Password strength, etc , There is no list of , Search a lot .), You can also see what I summarized 《 Regular expressions commonly used in front-end form validation 》

### 1.1 User name regular

``````// User name regular ,4 To 16 position （ Letter , Numbers , Underline , minus sign ）
var uPattern = /^[a-zA-Z0-9_-]{4,16}\$/;
// Output  true
console.log(uPattern.test("caibaojian"));
// The strength of the password must be a combination of upper and lower case letters and numbers , Special characters cannot be used , The length is in 8-10 Between .

var reg = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])[\da-zA-Z]{8,10}\$/;

Copy code ``````

## 2. Regular grouping

Regular expressions are character by character to match , So if you want to match a word, such as `is` , Just have to write `/is/`, If you want to match `is` appear 3 Time , You can only write /`isisis/`, We want to use quantifiers `/is{3}/`, But this only means `s` appear 3 Time , How can I modify it to express `is` Three times , hold `is` Enclosed in brackets ,`/(is){3}/`. Put... In parentheses `is` Cover up , It means that it is a whole , A group , They will appear together , It's a successful match , So it's called grouping . Grouping has an important concept , It's quoting , When there are groups in a regular expression , We can get the content of the group , How to get , Namely `\$n`,` n` Representation number ,`\$1 ` Represents the content of the first group ,`\$2` Represents the content of the second group ,`\$3` Represents the content of the third group , By analogy , In fact, there is another `\$0`, It's more special , So list it separately , It said , The entire regular expression matches the successful content

### 2.1 Example ( If the telephone number is hidden in the middle )

``````//  Example 1
var reg=/(\d{3})\d{4}(\d{4})/;
var phone="13423874592";
console.log( phone.replace(reg,("\$1****\$2")));//134****4592

//  Example 2： The hump changes into a middle line
'fooBarBaz'.replace(/([A-Z])/g,"-\$1").toLowerCase() // foo-bar-baz

//  Example 3
let reg = /(\d{4})-(\d{2})-(\d{2})/g;
let string = '2017-03-20'
let replaceString = string.replace(reg,"\$2/\$3/\$1");
console.log(replaceString)  // 03/20/2017

//  Example 4
let reg = /(\d)2\1/g;
let string = '121 222 323 424'
let replaceString = string.replace(reg,'X');
console.log(replaceString)  // X X X X
Copy code ``````

``````// http://blog.csdn.net/icanlove/article/details/39499777
var v = "bl";

var re =new RegExp("^\d+" + v + "\$","gim"); // re by /^\d+bl\$/gim

// thus , The original problem has been completely solved .

// in addition , Another way is to use eval A method of dynamically executing a string , But I think from all aspects , It's all bad policy .

var re = eval("/^\d+" + v + "\$/gim")
Copy code ``````

## 4. string Of replace

Find a regular string , Just replace it with the corresponding string . Return the content after replacement

usage ： `String.replace( Regular , New string / Callback function )`（ In the callback function , The first parameter refers to the characters that match successfully every time ）

Example ： Sensitive word filtering , such as ” I love tian 'anmen square in Beijing , The sun rises over tian 'anmen square “.------ I love *****,*** The sun rose on the . namely （ Beijing and Tiananmen become Number ）,

At first we might think of such a method ：

``````var str = " I love tian 'anmen square in Beijing , The sun rises over tian 'anmen square .";
var re = / Beijing | The tiananmen square /g; //  Find Beijing   Or tiananmen square   The global matching
var str2 = str.replace(re,'*');
alert(str2) // I love **,* The sun rose on the
// This just turns what you find into a *, Not just a few words *.
Copy code ``````

If you want to realize that a few words correspond to several *, We can use callback function to realize ：

``````var str = " I love tian 'anmen square in Beijing , The sun rises over tian 'anmen square .";
var re = / Beijing | The tiananmen square /g; //  Find Beijing   Or tiananmen square   The global matching
var str2 = str.replace(re,function(str){
console.log(str); // For testing ： The first parameter of the function represents the regular characters found each time , So the first time str I mean Beijing   The second time str Is the tiananmen square   third time str Is the tiananmen square
var result = '';
for(var i=0;i<str.length;i  ){
result  = '*';
}
return result; // So when you find a few words, you return a few *
});
console.log(str2) // I love *****,*** The sun rose on the
Copy code ``````

The whole process is , Find Beijing , Replaced with two *, Find Tiananmen Square and replace it with 3 individual *, Find Tiananmen Square and replace with 3 individual *.

``````var arr = {
content: " Hello #D12345#,hello#D321#world",
lawitems: {
"D12345": "aaaa",
"D321": "bbbbb"
}
}

arr.content = arr.content.replace(/#([^#]+)#/g, function (match, \$1) {
return arr.lawitems[\$1]||match;// Not in the lawitems Find and return the original string
})
// " Hello aaaa,hellobbbbbworld"
Copy code ``````

`replace` Is a very useful method , Often used .

## 5. Boundary class (boudary)

The boundary class mainly uses four : ^ To begin with ,\$ What does it end with , boudary Show word boundaries ,B Indicates a non word boundary . The boundary is where words are separated from words , The most obvious is the space .

Writing an example can be more intuitive .

``````let reg = /is/g;
let string = 'this is a dog '
let replaceString = string.replace(reg,"IS");
console.log(replaceString)  // thIS IS a dog
Copy code ``````

Two `is` All replaced , This is in line with expectations . But how can we just replace the middle `is`, In the middle of the `is` There is a feature , It's a word , Because there are spaces in front and behind , Makes it separate from other words , Because there are spaces `is` To become a word , So spaces are word boundaries , `\b` Can match it . Change the regular expression to `/\bis/g`, You can see the output `this IS a dog`, Only match the second . What if you just want to change the first one ? That's good to do , Because the first one is Contained in a word , So it's not preceded by a word boundary , Direct change to `B` That's all right. , Change the regular expression to `/Bis/g` That's all right. .

Hump turn -

``````const hyphenateRE = /\B([A-Z])/g
const str = 'LiuWeiBo'
str.replace(hyphenateRE, '-\$1').toLowerCase() // liu-wei-bo
Copy code ``````

## 6. Regular assertion

Assertion , Match only one location , For example, look at the following example

``````//  such as , You want to match a “ people ” word , But you just want to match the Chinese characters , People who don't want to match the French can use the expression
/(?<= China ) people /
//  therefore , Expressions can only work when used in conjunction with other wildcards .
/(?=.*[a-z])\d/
//  This is just saying   Match with “ Any character followed by a lowercase letter ” Number at the beginning , Match only numbers .
Copy code ``````
``````//  Example 1
String(123456789).replace(/(\d)(?=(\d{3})+\$)/g, "\$1,");
// or
'123456789'.replace(/\B(?=(\d{3})+(?!\d))/g, ',')
//  The result is ：123,456,789

//  Example 2: Integers and decimals are compatible
'1234567890030.7890'.replace(/(?=\B(?:\d{3})+\b)(\d{3}(.\d+\$)?)/g,',\$1');
Copy code ``````

### 6.1 `(?=pattern)` Forward assertion

Represents a position in a string , The character sequence immediately after this position can match `pattern`

For example `a regular expression` This string , To match `regular` Medium re, But can't match `expression` Medium `re`, It can be used `re(?=gular)`, The expression qualifies `re` On the right , This position is followed by `gular`, But it doesn't consume `gular` These characters , Change the expression to `re(?=gular).`, Will match `reg`, Metacharacters . Match the `g`, The weight of brackets matches `e and g` Position between .

### 6.2 `(?!pattern)` Negative antecedent assertion ( Negative pre check , Non-fetch match )

Represents a position in a string , The character sequence immediately after this position cannot match `pattern`

For example `regex represents regular expression` This string , To match, divide `regex` and `regular` In addition to the re, It can be used `re(?!g)`, The expression qualifies `re` On the right , This position is not followed by a character `g`. The difference between negative and positive , It depends on whether the character after this position can match the expression in parentheses .

``````//  Will not match to contain  df The content of
var reg = /^(?!.*df).*\$/     // df It's a string you don't want to match .
reg.test('[email protected]') // true

var str = `[email protected] [email protected] [email protected] [email protected]`

reg.test(str) // false
Copy code ``````

### 6.3 `(?<=pattern)` Forward and backward assertions

Represents a position in a string , The character sequence immediately before this position can match `pattern` ES6+ Support post assertion

For example `regex represents regular expression` This string , Yes 4 Word , To match the inside of a word `re`, But it doesn't match the beginning of the word `re`, It can be used `(?<=\w)re`, Inside the word `re`, stay `re` It should be preceded by a word character . That's why it's called late assertion , Because the regular expression engine matches strings and expressions , Is to scan the characters in the string one by one from the front to the back , And judge whether it conforms to the expression , When the assertion is encountered in an expression , The regular expression engine needs to detect the scanned characters at the front of the string , It is backward relative to the scanning direction .

### 6.4 `(?<!pattern)` Negative hindrow assertion

Represents a position in a string , The character sequence immediately preceding this position cannot match `pattern`. ES6+ Support post assertion

For example `regex represents regular expression` This string , To match the beginning of a word `re`, It can be used `(?<!\w)re`. At the beginning of the word `re`, In this case , That is, not inside the word `re`, namely `re` Not preceded by word characters . You can also use it `\bre` To match .

## 7. Multi-line matching

`^` and `\$` Well understood. , `/^T/` In capital letters `T` At the beginning , `/T\$/` In capital letters `T` At the end , Pay attention to their writing position , One in front of , One in the back . If there is a newline character in the string ,` let string = '@123 @456 @789'`, The string behaves as if it had three lines . Here are `chrome` Output in browser

At this time, if `/^@/g` To match , It will only match the first @,

``````
let reg = /^@/g;
let string = `@123 @456 @789`
let replaceString = string.replace(reg,"X");
console.log(replaceString)
/* * X123 * @456 * @789 */
Copy code ``````

If you want to match three , Then you need to use `m` Modifier , Multiline identifier , It means that if there is a newline character in the string , Think of strings as multiple lines .`m ` Identifier , Only in regular expressions `^ or &` It works when , This is also the handle. `m` The reason why the identifier is put here .

More dry goods and high-quality articles move forward : weibozzz.github.io/