JavaScript RegExp Lookaheads

Lookaheads in JavaScript regular expressions allow you to match a pattern only if it is followed (or not followed) by another pattern. Unlike regular matches, lookaheads do not consume characters in the string but simply assert that a certain pattern is present at a specific position.

let regex1 = /\d(?=\D)/; 
let s1 = "a1b";
console.log(s1.match(regex1)); 

let regex2 = /\d(?!\D)/; 
let s2 = "123";
console.log(s2.match(regex2));

[ '1', index: 1, input: 'a1b', groups: undefined ]
[ '1', index: 0, input: '123', groups: undefined ]

• Positive Lookahead: In the regex \d(?=\D), the \d matches a digit, but the lookahead (?=\D) ensures that the digit is followed by a non-digit character.
• Negative Lookahead: In the regex \d(?!\D), the \d matches a digit, but the lookahead (?!\D) ensures that the digit is not followed by a non-digit character.

Syntax

Positive Lookahead (?=)

let regex = /pattern(?=followingPattern)/;

• pattern: The main pattern you're matching.
• followingPattern: The pattern that must follow the main pattern for a match to occur, but it is not included in the match.

Negative Lookahead (?!)

let regex = /pattern(?!followingPattern)/;

• pattern: The main pattern you're matching.
• followingPattern: The pattern that must not follow the main pattern for a match to occur.

Lookaheads are a bit confusing to understand, so let’s take some examples.

Example 1: This example demonstrates positive lookahead.

let s1 = "butterfly"; 
let s2 = "buttermilk"; 
let exp = /(butter(?=fly))/; 
let res1 = (exp.test(s1)); 
let res2 = (RegExp.$1); 
let res3 = (exp.test(s2)) 
console.log(res1);
console.log(res2); 
console.log(res3); 

true
butter
false

exp matches “butter” only if it is followed by “fly“. After testing the expression against s1, code outputs the contents of RegExp.$1, which is ‘butter‘ not ‘butterfly‘.The “fly” part of the pattern is contained inside of a lookahead and so isn’t returned as part of the group.

Example 2: The previous example can be converted to negative lookahead:

let s1 = "butterfly";
let s2 = "buttermilk";
let exp = /(butter(?=fly))/;
let res1 = (exp.test(s1));
let res2 = (RegExp.$1);
let res3 = (exp.test(s2))
console.log(res1);  
console.log(res2); 
console.log(res3);

true
butter
false

Here, the pattern matches “buttermilk” but not “butterfly” as “fly” doesn’t follow “butter“. After testing against s2, RegExp.$1 contains “butter” once again, not “buttermilk”.

Key Points to Remember

• Positive Lookahead (?=) ensures that a pattern is followed by another pattern without including that pattern in the match.
• Negative Lookahead (?!) ensures that a pattern is not followed by another pattern.
• Lookaheads are non-consuming assertions, means they check for the presence or absence of a pattern but do not include it in the match.
• Lookaheads are extremely useful in complex text validation, conditional matching, and scenarios where you need to check for patterns without including them in the result.