Regular Expressions Fast – JavaScript Regex (Beginner to Pro)

Source: Dev.to

What Is a Regular Expression?

A regular expression (regex) is a pattern used to match text.

In JavaScript, regex is mainly used with strings:

const text = "hello world";
text.match(/world/); // ['world']

You define regex patterns using the syntax:

/pattern/flags

Example

/hello/i

• hello → pattern
• i → flag (case‑insensitive)

How Regex Works (Mental Model)

Regex works left‑to‑right, character by character.

1. The engine reads the string.
2. It tries to match your pattern.
3. It stops when it fails or succeeds.

No mystery – just rules.

Creating Regex in JavaScript

1. Literal syntax (most common)

   const regex = /abc/;

2. Constructor syntax (dynamic patterns)

   const word = "abc";
   const regex = new RegExp(word);

   Use the constructor only when patterns must be dynamic.

Common Regex Methods in JavaScript

Characters and Literals

Basic matching

/hello/   // matches "hello"

Regex is case‑sensitive by default.

/hello/i  // matches "Hello", "HELLO", etc.

Special Characters (Meta Characters)

These characters have special meaning:

. ^ $ * + ? ( ) [ ] { } | \

To match them literally, escape with \\:

/\./  // matches a dot

Character Classes [ ]

Match one character from a set:

/[abc]/   // a OR b OR c
/[0-9]/   // any digit
/[a-z]/   // lowercase letters
/[A-Z]/   // uppercase letters

Negation

/[^0-9]/  // NOT a digit

Shorthand Character Classes

Example

/\d+/.test("123"); // true

Quantifiers (How Many?)

Quantifiers control repetition.

Examples

/a*/    // "", "a", "aaaa"
 /a+/    // "a", "aaaa"
 /a{2}/  // "aa"

Greedy vs. Lazy Matching

Regex is greedy by default.

"test".match(/.+/);
// matches "test"

Lazy version

"test".match(/.+?/);
// matches ""

Add ? after a quantifier to make it lazy.

Anchors ^ and $

Anchors match positions, not characters.

/^hello/   // starts with "hello"
/world$/  // ends with "world"

Useful for validation.

Groups ( )

Groups let you capture parts of a match.

const result = "2025-12-18".match(/(\d{4})-(\d{2})-(\d{2})/);
result[1]; // "2025" (year)
result[2]; // "12"   (month)
result[3]; // "18"   (day)

Non‑capturing group

/(?:abc)+/

Alternation | (OR)

/cat|dog/

Matches either cat or dog.

Flags

Example

/hello/gi

Lookaheads & Lookbehinds

Positive Lookahead

/\d(?=px)/   // digit followed by "px"

Negative Lookahead

/\d(?!px)/   // digit **not** followed by "px"

Lookbehind (modern JS)

If you master regex, text stops being messy.
It becomes structured, and that skill pays off forever.

Follow for more! @mahmud‑r‑farhan
Contact: https://gravatar.com/floawd