Regular expression

Learning to write regular expressions can be used in conjunction with the graphical regular expression website. You can better understand the meaning of regular expressions

Graphical regular expressions: Click to jump

The modifier

Tags, also known as modifiers, are used to specify additional matching strategies for regular expressions.

Tags are not written inside regular expressions. They are outside the expression and have the following format:

'BAnANa'.replace(/a+/g.The '*') // "BAnAN*"
'BAnANa'.replace(/a+/gi.The '*') // "B*n*N*"
Copy the code

The operator

The meaning of \

/ / sample 1
'1wa2b3e'.replace(/w/.The '*') // "1*wa2b3e"
Copy the code

/ / sample 2
'1wa2b3e'.replace(/\w/.The '*') // "*wa2b3"
Copy the code

^ and $

/^a/.test('a2sfade3') // true
/^a/.test('234weras') // false
/a$/.test('12sfadea') // true
/a$/.test('12sfadew') // false
Copy the code

The first string starts with a and matches true, and the second string does not start with a and matches false. The third string ends in a and matches true, and the fourth string does not end in a and matches false

As shown in the previous two examples, the re in example 1 is unescaped and matches the literal character W. The second example \w (described below) matches the first letter, number, or underscore in the string.

Or relationship

'aabbcacaabc'.replace(/[a|b]/.The '*') // "*abbcacaabc"
'aabbcacaabc'.replace(/[a|b]/g.The '*') // "****c*c***c"
Copy the code

// LiLei is replaced by LiLei;
'My name is Lilei'.replace(/Li(L|l)ei/g."Li lei");
Copy the code

? The meaning of qualifiers that limit occurrences of, *, +, etc

'aabbbaaaab'.replace(/a{3}/.The '*') // "aabbb*ab"
'aabbbaaaab'.replace(/a{3,}/.The '*') // "aabbb*b"
'aabbbaaaab'.replace(/ a/g {2, 3}.The '*') // "*bbb*ab"
Copy the code

metacharacters

Regular expressions are basically composed of two string types: textual characters and metacharacters. Metacharacters are special characters that have special meaning in regular expressions.

Let’s look at what metacharacters are.

Metacharacter meaning of common escape characters plus letters

/\d/.test('a') // false
/\d/.test('1') // true
/\D/.test('a') // true
/\D/.test('1') // false
/\w/.test('a_1') // true
/\w/.test(The '%') // false
/\W/.test('a_1') // false
/\W/.test(The '%') // true
Copy the code

Boundary metacharacter

// The boundary: \b range is: \W range
 "is this a book?".match(/\bis\b/g); // ["is"]
Copy the code

// positive positive check;
let str = "iphone3iphone4iphone11iphoneNumber";
// Replace iPhone with "Apple";
let reg = /iphone(? = \ d {1, 2})/g;
let res = str.replace(reg,The word "apple");
console.log(res);
Copy the code

// positive negation;
let str = "iphone3iphone4iphone11iphoneNumber";
// Replace iPhone with "Apple";
let reg = /iphone(? ! \ d {1, 2})/g;
let res = str.replace(reg,The word "apple");
console.log(res);
Copy the code

// negative affirmative pre-check;
let str = "10px20px30pxipx";
// px--> pixel;
let reg =  / (? <=\d{2})px/g;
let res = str.replace(reg,"Pixel");
console.log(res);
Copy the code

// negative negative check;
let str = "10px20px30pxipx";
// px--> pixel;
let reg =  / (? 
      ;
let res = str.replace(reg,"Pixel");
console.log(res);
Copy the code

Common metacharacters such as tabs

/\f/.test('\x0c') // true
Copy the code

Character set

'plain'.replace(/[abc]/g.The '*') // "pl*in"
'plain'.replace(/[^abc]/g.The '*') // "**a**"
/[a-z]/.test('aglkshjeroihskjngbhlskfgh') // true
/^[a-z]/.test('aglkshjeroihskjngbhlskfgh') //false
Copy the code

Other metacharacters

grouping

What is grouping

To repeat a single character, it is very simple to simply add a qualifier after the character. For example, a+ means to match one or more a, a? Matches 0 or 1 A. But what if we want to repeat multiple characters? We can use parentheses () to specify which subexpression to repeat, and then repeat the subexpression, for example :(ABC)? Zero or one ABCs where a parenthesis is a grouping.

'abcdababcdababcdabacdbab'.replace(/(ab){2}/g."*"); // "abcd*cd*cdabacdbab"
Copy the code

Grouping can be divided into two forms, capturing groups and non-capturing groups.

In the expression (A)(B(C)), there are four such groups:

// Convert time format: 2020-12-09 ----> 2020/12/09
 "2020-12-09".replace(/ (\ d {4}) - (\ d {1, 2}) - (\ d {1, 2})/g."$1 / $2 / $3"); / / "2020/12/09"
Copy the code

backreferences

// Convert time format: 2020-12-09 ----> 09/12/2020;
 "2020-12-09".replace(/ (\ d {4}) - (\ d {1, 2}) - (\ d {1, 2})/g."$3 / $2 / $1"); / / "09/12/2020"
Copy the code

After grouping

/ /? < Group name > NEW features in ES2018;
let res = "$name=zhangsan&age=20".match(/ \ $(? 
      
       \w+)/
      );
console.log(res.groups.str); // "name"
Copy the code

The regular way

test

The test() method searches for the value specified in the string, returning true or false based on the result.

/abc/.test('abc') // true
/abd/.test('abc') // false
Copy the code

exec

The exec() method retrieves the specified value in the string. The return value is the value that was found. If no match is found, null is returned

/abc/.exec('qabcz') // ["abc", index: 1, input: "qabcz", groups: undefined]
/abd/.exec('qwerr') // null
Copy the code

String-dependent re methods

replace

The replace() method is used to replace some characters in a string with other characters, or to replace a substring that matches a regular expression.

Suitable for replacing sensitive words

"Buy an iPhone".replace(/ apple /.The '*') // "Buy a * phone"
"Buy an iPhone".replace(/ apple /.function(v){
return The '*'.repeat(v.length)
})// "Buy a mobile phone"
Copy the code

match

The match() method retrieves a specified value within a string or finds a match for one or more regular expressions.

"fdsa1231dfaf232fda".match(/\d+/g) / / / "1231", "232"]
Copy the code

search

The search() method is used to retrieve a specified substring in a string, or to retrieve a substring that matches a regular expression.

"fdsa1231dfaf232fda".search(/\d+/g) / / 4
Copy the code