Backreferences in JavaScript Regular Expressions

Backreferences allow you to refer to previously captured groups within the same regular expression. This means that you can match the same text that was captured in a previous group. JavaScript provides a way to do this using \N (where N is the group number) and \k<name> (for named groups).

Backreferences are useful when you need to ensure that a part of the pattern matches the same content as an earlier part of the pattern.

1. Backreferences with Group Numbers: `\N`

In JavaScript, you can refer to a captured group by its group number using the syntax \N, where N is the number of the capturing group (starting from 1).

Example: Backreference Using Group Numbers

let pattern = /(\d{2})-(\d{2})-\1/;
let str = "12-34-12";

let result = pattern.test(str);

console.log(result); // true

Explanation:

The regular expression (\d{2})-(\d{2})-\1 contains two groups:
- (\d{2}): The first capturing group matches exactly two digits.
- (\d{2}): The second capturing group matches two digits, but it doesn't matter if they're different from the first group.
\1 refers to the first captured group, so \1 matches exactly what was matched by the first group (i.e., two digits that are the same as the first group).
In the string "12-34-12", the last part of the string (12) matches the first captured group (12), which satisfies the backreference \1, so the match is successful.

2. Backreferences with Named Groups: `\k<name>`

Since ECMAScript 2018 (ES6), JavaScript supports named capturing groups, and you can refer to these named groups using the syntax \k<name>, where name is the name of the capturing group.

Example: Backreference Using Named Groups

let pattern = /(?<areaCode>\d{3})-(?<prefix>\d{3})-\k<areaCode>/;
let str = "123-456-123";

let result = pattern.test(str);

console.log(result); // true

Explanation:

The regular expression (?<areaCode>\d{3})-(?<prefix>\d{3})-\k<areaCode> contains two named capturing groups:
- (?<areaCode>\d{3}): The first named capturing group matches exactly three digits and assigns the name areaCode to this group.
- (?<prefix>\d{3}): The second named capturing group matches three digits and assigns the name prefix to this group.
\k<areaCode> refers to the first capturing group (areaCode). It ensures that the last part of the string matches the same value as the area code, which is "123" in this case.
In the string "123-456-123", the backreference \k<areaCode> matches "123", which is the same value as the first capturing group areaCode.

3. Use Case of Backreferences

Backreferences are particularly useful when you need to match patterns where the same value appears in different places within the string, such as matching duplicated words, ensuring pairs of parentheses match correctly, or verifying mirrored strings.

Example: Matching Duplicate Words

let pattern = /(\b\w+\b)\s+\1/;
let str = "hello hello";

let result = pattern.test(str);

console.log(result); // true

Explanation:

(\b\w+\b) is the first capturing group that matches a whole word. It uses word boundaries (\b) to ensure the match is a separate word.
\1 refers to the first capturing group, so it matches exactly the same word that was matched by the first group.
In the string "hello hello", the backreference \1 ensures that the word "hello" appears again, making the match successful.

4. Limitations

Backreferences with \N: You can only use numeric backreferences (like \1, \2, etc.) to refer to groups that were captured earlier in the regular expression.
Backreferences with \k<name>: Named backreferences (\k<name>) can only be used to refer to named capturing groups.

5. Conclusion

Backreferences are a powerful tool in JavaScript regular expressions, enabling you to match the same part of the string multiple times. You can refer to captured groups either by their number (e.g., \1, \2) or by name (e.g., \k<name>), making it easier to write complex patterns that involve repeated or mirrored content.

\N refers to a capturing group by its index (e.g., \1, \2, etc.).
\k<name> refers to a capturing group by its name, which improves code readability and flexibility.

Souy Soeng

Backreferences in JavaScript Regular Expressions