Javascript regexp Lookbehind

Lookbehind patterns enable JavaScript to move backward using the string to search for specified patterns. Lookaround is a combination of the Lookahead and Lookbehind expression. If input values come after another group of characters, we use the specific group of characters using lookbehind. When we wish to find various patterns within the same string, this is useful.

Syntax

The following syntax shows the positive Javascript regexp Lookbehind

The following syntax shows the negative Javascript regexp Lookbehind

Explanation

There are two different kinds of lookbehind, which are as follows:

Positive lookbehind: It is going to determine whether a specific element is included in the pattern but won't actually match it.
Negative lookbehind: It uses to check if a specific element is absent after the search pattern. Enclosing a specific pattern between patterns (?!) shows in a negative lookbehind.

Examples

The following examples show the positive and negative lookbehind of the regular expression.

Example1:

In the example, the "butter" matches with the fly or milk using the positive lookbehind expression. The first value comes after the pattern value then the output shows the true value.

<!DOCTYPE html>
<html>
<head>
<title> Javascript regexp Lookbehind </title>
</head>
<body>
<h3> Javascript regexp Lookbehind </h3>
<h4> Displays the similar values in the variable data using positive lookbehind. </h4>
<p id = "demo_data"> </p>
<p id = "demo_data1"> </p>
<p id = "demo_data2"> </p>
<p id = "demo_data3"> </p>
<script>
let first_word = "flybird";
let sec_word = "milkanimal";
let exp = /((?<=fly)bird)/;
let exp1 = /((?<=milk)animal)/;
let result1 = (exp.test(first_word));
let result2 = (exp.test(sec_word));
let result3 = (exp1.test(first_word));
let result4 = (exp1.test(sec_word));
document.getElementById('demo_data').innerHTML = result1;
document.getElementById('demo_data1').innerHTML = result2;
document.getElementById('demo_data2').innerHTML = result3;
document.getElementById('demo_data3').innerHTML = result4;
</script>
</body>
</html>

Output

The following image shows the Boolean values as an output.

Example2:

In the example, the "butter" matches with the fly or milk using the positive lookbehind expression. We can test the regular expression using the lookbehind pattern expression.

<!DOCTYPE html>
<html>
<head>
<title> Javascript regexp Lookbehind </title>
</head>
<body>
<h3> Javascript regexp Lookbehind </h3>
<h4> Displays the similar values in the variable data using positive lookbehind. </h4>
<p id = "demo_data"> </p>
<p id = "demo_data1"> </p>
<p id = "demo_data2"> </p>
<p id = "demo_data3"> </p>
<script>
let first_word = "flybird";
let sec_word = "milkanimal";
let exp = /((?<=fly)bird)/;
let exp1 = /((?<=milk)animal)/;
let result1 = (exp1.test(sec_word));
let result2 = (RegExp.$1);
let result4 = (exp.test(first_word));
let result3 = (RegExp.$1);
document.getElementById('demo_data').innerHTML = result1;
document.getElementById('demo_data1').innerHTML = result2;
document.getElementById('demo_data2').innerHTML = result3;
</script>
</body>
</html>

Output

The following image shows the data values as an output.

Example3:

In the example, the "butter" matches with the fly or milk using the negative lookbehind expression. If the first value does not get after the last value, then the output shows the true value. If the first value does not match with the last value, then the output shows a false value.

<!DOCTYPE html>
<html>
<head>
<title> Javascript regexp Lookbehind </title>
</head>
<body>
<h3> Javascript regexp Lookbehind </h3>
<h4> Displays the similar values in the variable data using negative lookbehind. </h4>
<p id = "demo_data"> </p>
<p id = "demo_data1"> </p>
<p id = "demo_data2"> </p>
<p id = "demo_data3"> </p>
<script>
let first_word = "flybird";
let sec_word = "milkanimal";
let exp = /((?<!flys)bird)/;
let exp1 = /((?<!milks)animal)/;
let result1 = (exp.test(first_word));
let result2 = (exp.test(sec_word));
let result3 = (exp1.test(first_word));
let result4 = (exp1.test(sec_word));
document.getElementById('demo_data').innerHTML = result1;
document.getElementById('demo_data1').innerHTML = result2;
document.getElementById('demo_data2').innerHTML = result3;
document.getElementById('demo_data3').innerHTML = result4;
</script>
</body>
</html>

Output

The following image shows the Boolean values as an output.

Example4:

In the example, the "butter" matches with the fly or milk using the positive lookbehind expression.

<!DOCTYPE html>
<html>
<head>
<title> Javascript regexp Lookbehind </title>
</head>
<body>
<h3> Javascript regexp Lookbehind </h3>
<h4> Displays the similar values in the variable data using positive lookbehind. </h4>
<p id = "demo_data"> </p>
<p id = "demo_data1"> </p>
<p id = "demo_data2"> </p>
<p id = "demo_data3"> </p>
<script>
let first_word = "flybird";
let sec_word = "milkanimal";
let exp1 = /((?<!milks)animal)/;
let result1 = (exp1.test(first_word));
let result2 = (exp1.test(sec_word))
let result3 = (RegExp.$1);
document.getElementById('demo_data').innerHTML = result1;
document.getElementById('demo_data1').innerHTML = result2;
document.getElementById('demo_data2').innerHTML = result3;
</script>
</body>
</html>

Output

The following image shows the Boolean values as an output.

Example5:

In the example, the lookbehind regexp uses to get the available values from pattern values. We can use the console tab, alert, and other output tabs to show after values. We can use the javascript match function with the expression function. Here, the output shows the values that come after the input value.

<!DOCTYPE html>
<html>
<head>
<title> Javascript regexp Lookbehind </title>
</head>
<body>
<h3> Javascript regexp Lookbehind </h3>
<h4> Displays the similar values in the variable data using positive lookbehind. </h4>
<p id = "demo_data"> </p>
<p id = "demo_data1"> </p>
<p id = "demo_data2"> </p>
<p id = "demo_data3"> </p>
<script>
let word1 = "web development !12costs 40@802";
let word2 = "32@430 for the !21tutorial";
let result1 = word1.match(/(?<=\@)\d+/);
let result2 = word2.match(/(?<=\@)\d+/);
let result3 = word1.match(/(?<=\!)\d+/);
let result4 = word2.match(/(?<=\!)\d+/);
document.getElementById('demo_data').innerHTML = result1;
document.getElementById('demo_data1').innerHTML = result2;
document.getElementById('demo_data2').innerHTML = result3;
document.getElementById('demo_data3').innerHTML = result4;
</script>
</body>
</html>

Output

The following image shows the available values as an output.

Example 6:

In the example, the negative lookbehind regexp uses to get the available values from pattern values.

<!DOCTYPE html>
<html>
<head>
<title> Javascript regexp Lookbehind </title>
</head>
<body>
<h3> Javascript regexp Lookbehind </h3>
<h4> Displays the similar values in the variable data using negative lookbehind. </h4>
<p id = "demo_data"> </p>
<p id = "demo_data1"> </p>
<p id = "demo_data2"> </p>
<p id = "demo_data3"> </p>
<script>
let word1 = "web development !12costs 40@802";
let word2 = "32@430 for the !21tutorial";
let result1 = word1.match(/(?<!\$)\b\d+/g);
let result2 = word2.match(/(?<!\$)\b\d+/g);
let result3 = word1.match(/(?<!\!)\b\d+/g);
let result4 = word2.match(/(?<!\@)\b\d+/g);
document.getElementById('demo_data').innerHTML = result1;
document.getElementById('demo_data1').innerHTML = result2;
document.getElementById('demo_data2').innerHTML = result3;
document.getElementById('demo_data3').innerHTML = result4;</script>
</body>
</html>

Output

The following image shows the exact values as an output.

Supported Browsers:

The following browsers support the javascript lookbehind expression.

Google Chrome
Firefox
Internet Explorer
Opera
Safari

Conclusion

The javascript lookbehind expression searches the required keyword in the string value after the input value. This expression uses for pattern recognization and operation.

Next TopicHow to remove classes in javascript

← prev next →