Regular Expressions Lookarounds by Stephen Bucaro

A Regular Expression (regex) is a sequence of characters that define a pattern that allows you to search, match, locate, replace, manipulate, and manage text. I explained the basics of Regular Expressions in an earlier article: What is a Regular Expression?

If you need to match a pattern only when it comes after another pattern (called a lookbehind) or only when it comes before another pattern (called a lookahead) you need these operations, cumulatively called lookarounds.

Lookbehind Positive

In the example below, we want to match the price in the string "I purchased 24 item number 6602 for $12 each."

<script>
let strTarget = "I purchased 24 item number 6602 for $12 each.";
let regexp = /(?<=\$)\d+/;
let res = strTarget.match(regexp);
alert(res);
</script>

The syntax for lookbehind positive is shown below.

(?<=B)A

It means match expression A, but only where it is preceded by expression B.

In this example expression A is one or more numerical digits, but they are matched only if preceded by expression B, which is a $ sign. Note that the dollar sign is escaped, \$, to make sure it's not confused with the $ end of string control character.

This example displays the number 12 in a message box.

Lookbehind Negative

In the example below, we want to match the quantity in the string "I purchased 24 item number 6602 for $12 each."

<script>
let strTarget = "At $9 each, I purchased 24 item number 6602.";
let regexp = /(?<!\$)\d+/;
let res = strTarget.match(regexp);
alert(res);
</script>

The syntax for lookbehind negative is shown below.

(?<!B)A

It means match expression A, only where it is NOT preceded by expression B.

In this example expression A is one or more numerical digits, but they are matched only if NOT preceded by expression B. Expression B is a $ sign followed by a numerical digit. So it will find the first numerical match which is NOT preceded by a $ sign.

This example displays the number 24 in a message box.

Lookahead Positive

In the example below, we want to match the item number in the string "I purchased 24 item number 6602 for $12 each."

<script>
let strTarget = "I purchased 24 item number 6602 for $12 each.";
let regexp = /\d+(?=\sfor)/;
let res = strTarget.match(regexp);
alert(res);
</script>

The syntax for lookahead positive is shown below.

A(?=B)

It means match expression A only where expression B follows.

In this example expression A is one or more numerical digits, but they are matched only if followed by expression B. Expression B is a space followed by the word "for". So it will NOT match the quantity 24, it will match the number 6602.

Note that expression A must be followed immediately by expression B, if this wasn't true, the quantity number would be the match because it is also followed by expression B, in fact it would be the first match.

This example displays the number 6602 in a message box.

Lookahead Negative

In the example below, we want to match the quantity in the string "I purchased 24 item number 6602 for $12 each."

<script>
let strTarget =  "I purchased 24 item number 6602 for $12 each.";
let regexp = /\d+(?!\sfor)/;
let res = strTarget.match(regexp);
alert(res);
</script>

The syntax for lookahead negative is shown below.

A(?!B)

It means match expression A only where expression B does NOT follow.

In this example expression A is one or more numerical digits, but they are matched only if NOT followed by expression B. Expression B is a space followed by the word "for". The first match for one or more numerical digits is the quantity, 24, and since it is not followed by a space and the word "for", it is the qualified match.

This example displays the number 24 in a message box.

In this article you learned how to match a pattern only when it comes after another pattern (or after not that pattern) or only when it comes before another pattern (or before not that pattern). Lookaround syntax can be difficult to master, but it's very powerful.

Learn more at amazon.com

More Java Script Code:
• Easy Code for Date Count Down
• Easy Code to Sort a Table by Column
• JavaScript Variable Scope
• Easy Slide Show Code with Mouseover Pause
• Calculators For Your Web Site : Length Units Converter
• Java Script Code for a Random Circle Generator
• JavaScript Cookbook
• HTML5 and Local Storage
• HTML5 Canvas lineCap and lineJoin Attributes
• Easy Picture Panning Code