Front-end basics - detailed explanation of regular expressions in JavaScript

1. Concept:

• Regular Expression (Regular Expression), a pattern used to describe a set of string characteristics, can be used to match specific strings.
• The essence is a rule string, which is written with specified symbols to formulate rules.

2. Application scenarios:

• Verification: verification of the legitimacy of form data;
• Search: Quickly extract specified content from a large amount of string data;
• Replacement: Quickly extract specified content from a large amount of string data and replace it;

3. How to create a regular expression:

• method one:

  • var 正则变量名称=new RegExp('正则表达式');

  • The use of escape characters \requires two\\

  • var telReg=new RegExp('^1[3-9]\\d{9}$');

• Method 2: (commonly used)

  • var 正则变量名称=/正则表达式/

  • \Only one escape character is required\

  • var telReg=/^1[3-9]\d{9}$/;

4. Grammar 

• character class
  • .
    • Match any one character.
  • []
    • Matches any character in the square brackets.
    • [abc]: Take any character in a, b, c.
  • -
    • Denote character ranges in square brackets.
    • [a-zA-Z]: Take any uppercase or lowercase letter.
    • [a-zA-Z0-9]: Take any number or letter.
  • ^
    • In the square brackets means any character except the characters in the square brackets.
    • [^a-zA-Z]: Take any character except letters.
• quantity qualifier
  • ?
    • The immediately preceding unit matches 0 or 1 times.
    • [a-z]?: 0 or 1 occurrence of a lowercase letter.
  • +
    • Matches the immediately preceding unit 1 or more times.
    • [a-z]+: 1 or more occurrences of lowercase letters.
  • *
    • Matches the immediately preceding unit any number of times.
    • [a-z]*: Any occurrence of lowercase letters.
  • {N}
    • The immediately preceding unit is matched N times.
    • [a-z]{2}: 2 occurrences of a lowercase letter.
  • {N,}
    • The immediately preceding unit matches at least N times.
    • [a-z]{2,}: A lowercase letter appears at least 2 times.
  • {0,M}
    • The immediately preceding element is matched at most M times.
    • [a-z]{,2}: A lowercase letter appears at most 2 times.
  • {N,M}
    • The immediately preceding unit is matched at least N times and at most M times.
    • [a-z]{6,12}: A lowercase letter appears at least 6 times and at most 12 times.
• positional qualifier
  • ^:
    • Matches the beginning of the line.
    • ^1: Start with 1.
    • ^[a-z]: Start with a lowercase letter.
  • $:
    • Matches the end of line position.
    • [a-z]$: Ends with a lowercase letter.
• predefined symbols
  • \w:
    • Any one of numbers, letters, and underscores. Equivalent to [a-zA-Z0-9_].
  • \W:
    • Any character except numbers, letters, and underscores. Equivalent to [^a-zA-Z0-9_].
  • \d:
    • Any one numeric character. Equivalent to [0-9].
  • \D:
    • Any one non-numeric character. Equivalent to [^0-9].
  • \s:
    • Matches any one whitespace character (space and newline).
  • \S:
    • Matches any one non-whitespace character (space and newline).
• special symbols
  • ()
    • Treat the content in parentheses as a unit (a whole).
    • \.(com|cn|org)$: End with .com, .cnor .org.
  • |
    • means or.
  • \
    • Escape character, to \escape the character on the right, if the character on the right has special meaning (regular character), after escaping, it will not have special meaning (ordinary character).

Five, commonly used functions: 

• test()

  • Determines whether the specified string satisfies the current regular expression rule, and returns true if it does, otherwise returns false.

  • var reg=/^\.(com|cn|org)$/;
    var str=prompt('请输入:');
    console.log(reg.test(str));

 6. Commonly used functions related to regular expressions in String

• match()

  • Used to retrieve the values ​​in the current string that match the specified regular expression.

  • parameter

    • Target regular expression.

  • return value

    • The result of the target character found.

    • var str='12ab34cd56ef78gh999';
      var reg=/[0-9]+/g;
      console.log(str.match(reg));//['12','34','56','78','999']

• replace()

  • Replaces values ​​in the current string that match the specified regular expression with the specified value.

  • parameter

    • Target regular expression.

  • return value

    • The string result after replacement.

    • var str='123abc456efg789';
      var reg=/[0-9]/g;
      console.log(str.replace(reg,'*'));//***abc***efg***

• split()

  • Split the value in the current string that matches the specified regular expression as a separator to form an array of substrings.

  • parameter

    • Target regular expression.

  • return value

    • Array of cut substrings.

    • var str='123abc456efg';
      var reg=/[0-9]+/;
      console.log(str.split(reg));//['','abc','efg']

Seven, matching mode

• Classification

  • u: Only match the first substring result. default mode.
  • g: Global matching mode, matching all substrings.
  • i: ignore case mode.

• use

  • method one:

    • var 正则变量名称=new RegExp('正则表达式','模式');

    • var telReg=new RegExp('[a-z]','ig');

    • Method 2: (commonly used)

      • var 正则变量名称=/正则表达式/模式

      • var telReg=/[a-z]/ig;