Master JavaScript Regular Expressions: From Basics to Advanced Techniques

Overview

Regular expressions (RegExp) are patterns that describe a set of strings and are used to locate, extract, or replace text. In JavaScript a regular expression is also an object that offers a rich API.

Definition Methods

Two ways to create a RegExp:

Literal syntax: /^\d+$/g Constructor:

new RegExp("^\\d+$", "g")

Modifiers (Flags)

Flags control how the pattern is applied. Common flags are: g – global search i – ignore case m – multiline u – Unicode s – dot matches newline y – sticky

Metacharacters

Simple characters match themselves (e.g., /abc/). Special characters add flexibility, such as *, +, ?, character classes, and anchors. Example: /ab*c/ matches a followed by zero or more b and a c.

Assertions

Assertions define positions without consuming characters:

Boundary assertions: ^ (start), $ (end), \b (word boundary), \B (non‑boundary)

Look‑ahead/look‑behind: x(?=y), x(?!y), (?<=y)x,

(?<!y)x

RegExp Object Properties and Methods

Important properties: source – the pattern string global, ignoreCase, multiline, unicode,

sticky

lastIndex

– index at which to start the next match (used with g)

Key methods: test(str) – returns true if the pattern matches exec(str) – returns an array with match details and updates

lastIndex

match

, matchAll, replace, search, split – string methods that accept a RegExp

var reg = /ab/g;
reg.ignoreCase; // false
reg.global; // true
reg.lastIndex; // 0
reg.exec('ababab'); // ["ab", index:0, input:"ababab"]
reg.lastIndex; // 2

Capturing Groups

Parentheses create a capturing group that stores the matched substring. The captured value can be referenced later with \1, \2, etc., or accessed via the groups property when using named groups.

/(
\w)+/.test('hello world'); // true – (
\w) is a capturing group

Non‑capturing Groups

Use (?:pattern) when grouping is needed but the content should not be captured, which saves memory and improves performance.

/(?:\w)+/.test('hello world'); // true – no capture

Greedy vs Lazy Matching

Quantifiers are greedy by default, consuming as many characters as possible. Adding ? makes them lazy (minimal match). ?, *, +, {n}, {n,},

{n,m}

var str = "aaaaa";
var reg = /a+/g;
str.match(reg); // ["aaaaa"]
var lazy = /a??/g;
str.match(lazy); // ["","","","","",""]

Backreferences

The syntax \1 refers to the text captured by the first group. It enables patterns like repeated characters.

var str = 'aaaaabbbbbbcccccccd';
var reg = /(\w)\1+/g;
str.replace(reg, '$1'); // "abcd"

Common Pitfalls

Typical mistakes include incorrect character ranges and misuse of lazy quantifiers:

/[1-51]/.test('6'); // false – range is malformed
'aaa'.match(/a*?/g); // returns four empty strings because the lazy * matches zero characters each time