Regular expressions (regex) are patterns used to match, search, and manipulate text. They look cryptic at first — /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/ — but once you understand the building blocks, they become one of the most powerful tools in any developer's toolkit.
Basic Character Matching
| Pattern | Matches | Example |
|---|---|---|
a | Literal character "a" | /cat/ matches "cat" |
. | Any character except newline | /c.t/ matches "cat", "cut", "c3t" |
\d | Any digit (0-9) | /\d/ matches "3" in "abc3" |
\w | Word char (a-z, A-Z, 0-9, _) | /\w+/ matches "hello_123" |
\s | Whitespace (space, tab, newline) | /\s/ matches spaces |
\D | Not a digit | Opposite of \d |
\W | Not a word character | Opposite of \w |
Quantifiers — How Many?
| Quantifier | Meaning | Example |
|---|---|---|
* | 0 or more | /go*/ matches "g", "go", "goo", "gooo" |
+ | 1 or more | /go+/ matches "go", "goo" (not "g") |
? | 0 or 1 (optional) | /colou?r/ matches "color" and "colour" |
{3} | Exactly 3 | /\d{3}/ matches "123" |
{2,5} | 2 to 5 | /\d{2,5}/ matches "12", "123", "1234" |
{2,} | 2 or more | /\d{2,}/ matches "12" and longer |
Anchors — Position Matching
TEXT
^ — Start of string (or line with multiline flag)
$ — End of string (or line with multiline flag)
\b — Word boundary
\B — Not a word boundary
Examples:
/^hello/ matches "hello world" but NOT "say hello"
/world$/ matches "hello world" but NOT "world peace"
/\bcat\b/ matches "cat" in "the cat sat" but NOT in "catch"Character Classes
TEXT
[abc] — matches a, b, or c
[a-z] — matches any lowercase letter
[A-Z] — matches any uppercase letter
[0-9] — matches any digit (same as \d)
[a-zA-Z] — matches any letter
[^abc] — negation: matches anything EXCEPT a, b, or c
[^0-9] — matches any non-digit (same as \D)Groups and Capturing
JAVASCRIPT
// Capturing group — (...)
const match = "2024-12-25".match(/(\d{4})-(\d{2})-(\d{2})/);
console.log(match[1]); // "2024" — year
console.log(match[2]); // "12" — month
console.log(match[3]); // "25" — day
// Named capturing group — (?<name>...)
const { groups } = "2024-12-25".match(
/(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/
);
console.log(groups.year); // "2024"
console.log(groups.month); // "12"Lookahead and Lookbehind
TEXT
(?=...) Positive lookahead — followed by
(?!...) Negative lookahead — NOT followed by
(?<=...) Positive lookbehind — preceded by
(?<!...) Negative lookbehind — NOT preceded by
Examples:
/\d+(?= dollars)/ matches "100" in "100 dollars"
/(?<=\$)\d+/ matches "100" in "$100"
/\bword(?!s\b)/ matches "word" but not "words"Real-World Regex Patterns
JAVASCRIPT
// Email validation (simplified)
/^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/
// URL matching
/https?:\/\/[\w-]+(\.[\w-]+)+(\/[\w-./?%&=]*)?/
// Phone (flexible)
/^[+]?[(]?\d{3}[)]?[-\s.]?\d{3}[-\s.]?\d{4,6}$/
// IPv4 address
/^(\d{1,3}\.){3}\d{1,3}$/
// Strong password (8+ chars, upper, lower, digit, special)
/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/
// Hex color
/#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})\b/
// ISO date
/^\d{4}-(0[1-9]|1[0-2])-(0[1-9]|[12]\d|3[01])$/Flags
| Flag | Name | Effect |
|---|---|---|
g | Global | Find all matches, not just first |
i | Case-insensitive | /hello/i matches "Hello", "HELLO" |
m | Multiline | ^ and $ match start/end of each line |
s | Dotall | . matches newlines too |
u | Unicode | Enables full Unicode support |
Use DevToolkit's Regex Tester to build and debug regex patterns in real-time with match highlighting, capture group visualization, and ReDoS detection.