How to use regular expressions elegantly in Javascript

Write an article summarizing how to use regular expressions in JS.

The RegExp type

You can create a regular expression in JS with let expression = / pattern/flags. This expression is supported by the RegExp reference type.

Where the Parttern can be any simple or complex regular expression. Each regular expression can have one or more flags that indicate the behavior of the expression.

• g: represents the global pattern, that is, the pattern will be applied to all strings, instead of stopping immediately after the first match is found.
• i: indicates case insensitive
• m: indicates the multi-line mode

Like other languages, all the metacharacters used in the model have to escape, yuan characters in regular expressions include: (1) {[\ ^ $|]? * +.})

You can also use the constructor of RegExp to declare regular expressions

let pattern1 = /[bc]at/i // Match the first bat or cat case insensitive

let pattern2 = /\[bc\]at/i // Match the first [BC]at case insensitive
Copy the code

Is equivalent to

let pattern1 = new RegExp('[bc]at'.'i') // Match the first bat or cat case insensitive

let pattern2 = new RegExp('\\[bc\\]at'.'i') // Match the first [BC]at case insensitive
Copy the code

Since RegExp takes a string as an argument, all metacharacters need to be double-escaped

Instance method of RegExp

The main method of the RegExp object is exec()

The exec() method takes an argument (string) and returns an array containing information about the first match, or null if there is no match. The returned array instance contains additional index and input attributes. Index indicates the position of the match in the string, and input indicates the string to which the regular expression is applied.

Take a chestnut

The grouping grammar in chestnut can be viewed in the grouping section.

let text = 'mom and dad and baby'
let pattern = /mom( and dad (and baby)?) ? /gi
const list = pattern.exec(text)

console.log(list.index)  / / 0
console.log(list.input)  // 'mom and dad and baby'
console.log(list[0])  // 'mom and dad and baby'
console.log(list[1])  // ' and dad and baby'
console.log(list[2])  // 'and baby'
Copy the code

The second method on the RegExp object is test()

The test() method takes a string argument and returns true if the re matches the argument and false if it does not

metacharacters

/\ba\w*b/.test(/** matches words that begin with the letter a */)
Copy the code

repeat

string

[aeiou] matches any English vowel, [.?!] Matches punctuation (. Or? Or!) , [0-9] is equivalent to /d matching one digit, [a-z0-9a-z] is equivalent to /w.

Branch conditions

/ 0 \ d {2} – \ d {8} | 0 \ d {3} – \ d {7} / this expression to match the phone number of the two separated with: one is the three codes, eight local number (such as: 010-12345678), one kind is four area code, seven local number (such as 0376-2233445)

/\(0\d{2}\)[-]? \d{8}|0\d{2}[-]? \d{8}/ This expression matches a phone number with a 3-digit area code, which can be enclosed in parentheses or not, separated from the local number by hyphens, Spaces, or no space

grouping

We can specify subexpression (also called grouping) with parentheses so that we can specify the number of repetitions of multiple characters (subexpression)

(\ d {1, 3} \.) {3}\d{1,3} is a simple IP address token expression

antisense

String (stringYou can use the re method in

The String type defines several methods for matching a re in a String, the first being match()

The match() method has the same result as exec(). This method takes only one argument (a regular expression).

const text = 'cat, bat, sat, fat, hat'
const pattern = /.at/

const matches = text.match(pattern)

console.log(matches.index)  / / 0
console.log(matches[0])  // cat
Copy the code

const text = 'cat, bat, sat, fat, hat'
const pattern = /.at/g

const matches = text.match(pattern)

console.log(matches)  // ['cat', 'bat', 'sat', 'fat', 'hat']
Copy the code

The second method is the replace method, which takes two arguments. The first argument is a re or a string, and the second argument can be a string or a function. If the first argument is a string, only the first self-string is replaced. If you want to replace all matched self-strings you need to provide a regular expression and specify a global (g) flag.

const text = 'cat, bat, sat, fat'
const result = text.replace('at'.'ond')
console.log(result)  // cond, bat, sat, fat

const text = 'cat, bat, sat, fat'
const result = text.replace(/at/g.'ond')
console.log(result)  // cond, bond, sond, fond
Copy the code

The second argument to the replace() method can also be a function that, if there is only one match, passes three arguments to the function, the match, the position of the match in the string, and the original string. If there are multiple matches, the argument list is, first match, second match,….. , the last two items are still the matching item’s position in the string and the original string. The return value of this function should be a string representing the match being replaced.

A selection of interview questions

How do I implement trim() with re?

const trim = (str) = > str.replace(/^\s+|\s+$/g."")
Copy the code

Implement a simple function conversion function with re

// Convert normal function declarations into es6 syntax anonymous function declarations
// Do not consider closures, special symbols, function context, and other marginal cases

// Input parameter format reference 1:
const inputFuncStr = "function a () { console.log('transfer') }";
// Output parameter format reference 1:
const outputFuncStr = "const a = () => { console.log('transfer') }";

// case1
const inputFuncStrCase1 = "function() {}"
// expect1
const outputFuncStrExpect1 = "() = > {}";

// case2
const inputFuncStrCase2 = "const a = function() {}"
// expect2
const outputFuncStrExpect2 = "const a = () => {}";

// case3
const inputFuncStrCase3 = "function test_1() {}"
// expect3
const outputFuncStrExpect3 = "const test_1 = () => {}";


export function transfer(normalText) {
  let reg = /(function)([\w ]*)(\([\w ,]*\))/
  return normalText
    .replace(reg, (match, s1, s2, s3) => {
      if (s2) {
        return `const${s2}= ${s3}= > `
      } else {
        return `${s3}= > `}})}Copy the code