Regex Tester JavaScript
A regex tester for JavaScript lets you write and validate regular expressions with live feedback — no console.log loops, no Node.js terminal, no guessing. Paste your pattern and test string, and see exactly which parts match, which groups capture, and where the regex fails.
This guide covers JavaScript regex syntax, the most useful patterns, and how to avoid the common traps that make regex debugging painful.
JavaScript Regex Basics
JavaScript has built-in regular expression support via the RegExp object and regex literals:
// Regex literal syntax (preferred)
const pattern = /hello/i;
// Constructor syntax (for dynamic patterns)
const term = "hello";
const dynamic = new RegExp(term, "i");
// Test if a string matches
console.log(pattern.test("Hello World")); // true
// Find all matches
console.log("Hello hello".match(/hello/gi)); // ["Hello", "hello"]
Regex Flags in JavaScript
Flags change how the pattern behaves:
| Flag | Name | Effect |
|---|---|---|
g |
Global | Find all matches, not just the first |
i |
Case-insensitive |
A matches a
|
m |
Multiline |
^ and $ match line starts/ends, not just string start/end |
s |
DotAll |
. matches newlines (ES2018+) |
u |
Unicode | Enables full Unicode matching |
d |
Indices |
match() returns indices for each capture group (ES2022+) |
// Without multiline: only matches at string start
/^\w+/.test("first line\nsecond line"); // true (matches "first")
// With multiline: matches at each line start
"first\nsecond".match(/^\w+/gm); // ["first", "second"]
Essential JavaScript Regex Patterns
Email Validation
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
emailRegex.test("user@example.com"); // true
emailRegex.test("not-an-email"); // false
Note: A truly RFC-compliant email regex is extremely complex. For production, use a library or server-side validation after a basic format check.
URL Extraction
const urlRegex = /https?:\/\/[^\s<>"{}|\\^`\[\]]+/g;
const text = "Visit https://devplaybook.cc or https://example.com";
const urls = text.match(urlRegex);
// ["https://devplaybook.cc", "https://example.com"]
Named Capture Groups
const dateRegex = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/;
const match = "2026-03-24".match(dateRegex);
if (match) {
const { year, month, day } = match.groups;
console.log(year, month, day); // "2026" "03" "24"
}
Named groups make your regex self-documenting and easier to maintain.
Phone Number Normalization
// Match US phone numbers in various formats
const phoneRegex = /^\(?(\d{3})\)?[-.\s]?(\d{3})[-.\s]?(\d{4})$/;
const formats = [
"(415) 555-1234",
"415-555-1234",
"415.555.1234",
"4155551234",
];
formats.forEach(p => console.log(phoneRegex.test(p))); // all true
// Extract and normalize
"(415) 555-1234".replace(phoneRegex, "$1-$2-$3"); // "415-555-1234"
Password Strength Check
// Require: 8+ chars, one uppercase, one lowercase, one digit, one special char
const strongPassword = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/;
strongPassword.test("Weak1!"); // false (too short)
strongPassword.test("Strong1!"); // false (no special except !)
strongPassword.test("Str0ng@Pass"); // true
The Three Main Regex Methods
test() — Boolean Check
const hasNumbers = /\d/.test("abc123"); // true
Use when you only need to know if a pattern exists. Fastest option.
match() — Extract Matches
// Without 'g' flag: returns first match with groups
"2026-03-24".match(/(\d{4})-(\d{2})-(\d{2})/);
// ["2026-03-24", "2026", "03", "24", index: 0, ...]
// With 'g' flag: returns all matches, no groups
"cat bat sat".match(/[cbsr]at/g);
// ["cat", "bat", "sat"]
replace() — Transform Strings
// Replace first match
"hello world".replace(/\w+/, "FIRST"); // "FIRST world"
// Replace all matches (use /g or replaceAll)
"hello world".replace(/\w+/g, s => s.toUpperCase()); // "HELLO WORLD"
// Use captured groups in replacement
"John Smith".replace(/(\w+)\s(\w+)/, "$2, $1"); // "Smith, John"
Common Regex Mistakes in JavaScript
Mistake 1: Forgetting the g Flag with exec()
With the global flag, exec() advances lastIndex on each call:
const re = /\d+/g;
const str = "abc 123 def 456";
let match;
while ((match = re.exec(str)) !== null) {
console.log(match[0]); // "123", then "456"
}
Without the g flag, exec() always returns the first match.
Mistake 2: Escaping Special Characters
Inside a regex, . matches any character, not a literal dot. Escape with \:
// WRONG: "3.14" matches "3X14", "3a14", etc.
/3.14/.test("3x14"); // true
// CORRECT: only matches literal "3.14"
/3\.14/.test("3x14"); // false
/3\.14/.test("3.14"); // true
Mistake 3: Using new RegExp() Without Escaping Backslashes
In a string, \d becomes d before the regex engine sees it. Double the backslash:
// WRONG: \d is treated as just "d"
new RegExp("\d+");
// CORRECT: \\d becomes \d in the regex
new RegExp("\\d+");
Free Regex Testers for JavaScript
DevPlaybook Regex Playground — Test patterns against multiline strings with live match highlighting and capture group display.
Regex Tester Pro — Advanced version with flag toggles, replacement preview, and pattern explanation.
AI Regex Explainer — Paste any complex regex and get a plain-English explanation of what each part does.
For learning regex patterns, see also: 10 Essential Regex Patterns Every Developer Should Know.
Regex Cheatsheet
Character Classes:
\d digit (0-9)
\w word char (a-z, A-Z, 0-9, _)
\s whitespace
\D non-digit
\W non-word
\S non-whitespace
[abc] any of a, b, c
[^abc] not a, b, or c
Quantifiers:
* 0 or more
+ 1 or more
? 0 or 1
{n} exactly n
{n,} n or more
{n,m} between n and m
*? lazy (match as few as possible)
Anchors:
^ start of string (or line with m flag)
$ end of string (or line with m flag)
\b word boundary
\B non-word boundary
Groups:
(abc) capturing group
(?:abc) non-capturing group
(?<name>…) named capturing group
(?=abc) positive lookahead
(?!abc) negative lookahead
(?<=abc) positive lookbehind (ES2018+)
(?<!abc) negative lookbehind (ES2018+)
Summary
A regex tester for JavaScript speeds up pattern development by giving you immediate visual feedback. Key takeaways:
- Use named capture groups for readable, maintainable patterns
- Always escape literal special characters like
.and+ - Check your flags —
g,m, andschange behavior significantly - Use
test()for boolean checks,match()to extract values,replace()to transform
Test your patterns in the DevPlaybook Regex Playground before shipping to production.
Speed Up Your Development Workflow
The Developer Productivity Bundle includes 51 VSCode snippets — covering JavaScript, TypeScript, React, and Python patterns — so you spend less time writing boilerplate and more time solving problems. $29, one-time.
Level Up Your Dev Workflow
Found this useful? Explore DevPlaybook — cheat sheets, tool comparisons, and hands-on guides for modern developers.
🛒 Get the DevToolkit Starter Kit on Gumroad — 40+ browser-based dev tools, source code + deployment guide included.
Top comments (0)