Regular Expressions in JavaScript

This guide demonstrates the practical application of regular expressions within JavaScript. By the end, you'll be able to confidently use regex for text manipulation.

Key Concepts:

• JavaScript regular expressions are powerful tools for text processing. They're defined using forward slashes (/), with optional flags (e.g., /pattern/gi for global and case-insensitive matching). For example, /JavaScript/ matches the string "JavaScript".
• Strings in JavaScript offer three key methods for regex interaction: match(), replace(), and search().
• match() finds all matching substrings, returning an array (or null if no matches are found).
• replace() substitutes matching substrings with a new string. This is invaluable for tasks like correcting typos or standardizing text formats.
• search() functions similarly to indexOf(), but uses a regular expression as its search parameter, returning the index of the first match (or -1 if none exist).

Using Regular Expressions:

Creating a regular expression is straightforward:

const myRE = /regexp/;

Where regexp represents the regular expression pattern. For instance:

const myRE = /JavaScript/; // Matches "JavaScript"
const myRE = /^(ba|na)+$/; // Matches "banana", "nababa", "baba", etc.

By default, regex is case-sensitive and only finds the first match. Adding flags modifies this behavior: g (global) for all matches, and i (case-insensitive).

Example Regular Expressions and Matches in "test1 Test2 TEST3":

RegExp	Match(es)
/Test[0-9] /	"Test2"
/Test[0-9] /i	"test1"
/Test[0-9] /gi	"test1", "Test2", "TEST3"

Methods for Working with Regular Expressions:

• match(): This method returns an array of all matches. Let's create a phone number validation function:

const myRE = /regexp/;

This regex ^(d{3}) d{3}-d{4}$ matches a phone number format like "(123) 456-7890". ^ and $ ensure the entire string matches the pattern. d{3} matches three digits.

• replace(): This method replaces matches with a new string. Let's correct "I before E except after C" misspellings:

const myRE = /JavaScript/; // Matches "JavaScript"
const myRE = /^(ba|na)+$/; // Matches "banana", "nababa", "baba", etc.

in the replacement string refers to the captured group (the letter before "ei") in the regex ([abd-z])ei.

• search(): This method is similar to indexOf(), but uses a regular expression. It returns the index of the first match.

function checkPhoneNumber(phoneNo) {
  const phoneRE = /^\(\d{3}\) \d{3}-\d{4}$/;
  return phoneNo.match(phoneRE) !== null; //true if valid, false otherwise
}

Conclusion:

Regular expressions are a powerful tool for string manipulation in JavaScript. Mastering these techniques enhances your ability to validate user input, clean data, and perform sophisticated text processing. Remember that server-side validation is still crucial for security.

The above is the detailed content of Regular Expressions in JavaScript. For more information, please follow other related articles on the PHP Chinese website!