JavaScript — RegExp

Patterns that find text

A regular expression describes shapes of text — emails, phone numbers, hashtags:

const re = /cat/;                 // literal pattern
const re2 = new RegExp("cat");    // dynamic construction

re.test("concatenate");           // true — contains "cat" anywhere

Character building blocks

Pattern	Matches
abc	exactly "abc"
.	any single char
\d	digit 0–9
\w	letter/digit/underscore
\s	whitespace
[aeiou]	any listed char
[a-z0-9]	ranges
[^0-9]	NOT a digit

Quantifiers

/colou?r/.test("color")     // u optional → matches both spellings
/\d{3}/.test("123456")      // exactly 3 digits in a row
/\d{2,4}/                   // two to four digits
/a+/                        // one or more
/a*/                        // zero or more

Anchors pin positions: ^start, end$.

/^\d{4}$/.test("2026");   // true — ENTIRE string is 4 digits

Flags change behavior

/hello/i            // case-INsensitive
/hello/g            // global — all matches, not just first
/m                  // multiline ^/$ handling

Combined: /pattern/gi.

The three everyday methods

test — boolean check (validation!)

const zipOK = /^\d{5}$/.test(userInput);

match — extract

"I have 2 cats and 11 fish".match(/\d+/g);   // ["2", "11"]

// capture groups pull parts out:
const [full, user, domain] = "ada@ex.com".match(/(.+)@(.+)/);

replace — rewrite

"2026-08-23".replace(/(\d{4})-(\d{2})-(\d{2})/, "$2/$3/$1");
// "08/23/2026"

text.replace(/\s+/g, " ");     // collapse all whitespace runs

Practical patterns worth memorizing

// slugify a title
title.toLowerCase().trim().replace(/[^\w]+/g, "-");

// strip HTML tags (naive but common)
str.replace(/<[^>]*>/g, "");

// basic email shape check
/^\S+@\S+\.\S+$/.test(email);

// password must contain a digit AND be 8+ chars
/^(?=.*\d).{8,}$/.test(pw);

Honesty note: full email/HTML parsing via regex is famously impossible ("then you have two problems"). The patterns above are pragmatic shape checks; production validation belongs server-side with real libraries.

Greedy vs lazy (one paragraph)

Quantifiers grab as much as possible (greedy). Add ? to make them minimal (lazy): <.+?> stops at the first > instead of the last.

Mini Practice

1. Validate five inputs against /^\d{10}$/ (phone shapes)
2. Extract all hashtags from a tweet: /#\w+/g
3. Slugify three titles; test spaces, punctuation, emoji
4. Capture-group swap: turn "Last, First" into "First Last"
5. Write /^...$/ anchored tests and prove unanchored versions over-match

Next: errors →