Regex Tester: /write and test/ Regular Expressions

A Regular Expression (often shortened to "regex" or "regexp") is a formal sequence of characters that defines a search pattern. Think of it as a highly flexible "find" command that can describe complex text structures rather than just literal strings. Instead of searching for the exact word "cat", a regex can search for any three-letter word starting with 'c' followed by a vowel.

Regex is used across virtually every programming language and platform. In JavaScript, regex is built into the language via the RegExp object. Common real-world applications include: validating email addresses and phone numbers in web forms, extracting data from structured text (like log files or HTML), performing search-and-replace operations in code editors, parsing URL structures in routing frameworks, and sanitizing user input in backend systems.

The pattern /\d{3}-\d{4}/ would match any phone number in the format "555-1234". The \d token means "any digit", and {3} means "exactly three times". This concise notation is why regex is so powerful - a single short pattern can describe an enormous range of text.

Flags (also called modifiers) are single letters appended after the closing slash of a regex literal to change how the matching engine behaves. In JavaScript, the three most common flags are:

g (Global): Without this flag, a regex stops after finding the first match. With g, the engine scans the entire input and returns all matches. This is essential for any operation that needs to count, replace, or extract every occurrence of a pattern in a longer string.

i (Case-Insensitive): By default, regex treats uppercase and lowercase as different characters - /apple/ would not match "Apple". The i flag disables this distinction. With /apple/i, the pattern matches "apple", "Apple", "APPLE", and any other capitalization variant.

m (Multiline): This flag changes the behavior of the anchor characters ^ (start) and $ (end). Without m, these anchors refer to the start and end of the entire string. With m, they refer to the start and end of each individual line, separated by newline characters. This is critical when processing multi-line text files or log entries.

Flags can be combined freely. /pattern/gim applies all three simultaneously. Another useful JavaScript flag is s (dotAll), which makes the . character match newlines in addition to all other characters - useful when your target pattern spans multiple lines.

This is one of the most important and often misunderstood concepts in regex. Greedy matching is the default behavior: quantifiers like +, *, and {n,m} will try to match as many characters as possible while still allowing the overall pattern to succeed. The engine essentially "gobbles up" as much text as it can, then backtracks only if the rest of the pattern fails to match.

Consider the HTML string <b>bold</b> and <b>italic</b>. The greedy pattern /<b>.+<\/b>/ would match the entire string from the first <b> to the last </b>, not just the first bold tag. That is because .+ matches everything, including the intermediate tags.

Lazy matching (also called "reluctant" or "non-greedy") is activated by adding a ? after the quantifier: +?, *?, or {n,m}?. A lazy quantifier matches as few characters as possible. The lazy pattern /<b>.+?<\/b>/g applied to the same HTML string would correctly find two separate matches: <b>bold</b> and <b>italic</b>. When extracting content from structured text, lazy quantifiers are usually what you actually want.

Capture groups are sub-patterns wrapped in parentheses ( ) within your regex. They serve two purposes: they group a part of the pattern together (so you can apply a quantifier to the whole group), and they capture the text matched by that sub-pattern so you can retrieve it separately from the full match.

For example, the pattern /(\d{4})-(\d{2})-(\d{2})/ matches a date in ISO format like "2025-07-04". The full match is "2025-07-04", but Group 1 captures "2025" (the year), Group 2 captures "07" (the month), and Group 3 captures "04" (the day). In JavaScript, you access these via the array returned by String.match() or RegExp.exec(): index 0 is the full match, index 1 is Group 1, index 2 is Group 2, and so on.

Named capture groups, supported in modern JavaScript, improve readability enormously. The syntax is (?<year>\d{4}). You then access the captured value via match.groups.year instead of a numeric index. This makes complex patterns self-documenting.

If you want to use parentheses for grouping without capturing the sub-match (which improves performance slightly), use a non-capturing group: (?:pattern). This is useful when you need to apply a quantifier to a group but do not need the captured text in your result.

Meta-characters are characters that have a special meaning inside a regex pattern rather than representing themselves literally. The full set in JavaScript regex is: . * + ? ^ $ { } [ ] | ( ) \. When the regex engine encounters these characters, it interprets them as instructions rather than as characters to match.

For instance, the dot . is a meta-character meaning "match any single character (except a newline)". If you want to match an actual period in a string like "3.14", writing the pattern /3.14/ would technically work but would also match "3X14" or "3 14" because the dot matches anything. The correct, precise pattern is /3\.14/, where the backslash \ escapes the dot, instructing the engine to treat it as a literal period character.

Escaping means placing a backslash immediately before a meta-character to strip it of its special meaning. To match a literal dollar sign, write \$. To match a literal opening parenthesis, write \(. To match a literal backslash itself, write \\. When constructing regex patterns from user input as strings in JavaScript (using new RegExp(string)), you must double-escape backslashes: what you want as \d in the pattern must be written as "\\d" in the string, because JavaScript's string parser consumes one backslash before the RegExp engine ever sees the value.