JavaScript regexp向前查找

向前查找模式使JavaScript能够在字符串中向前移动以查找指定的模式。Lookaround是Lookahead和Lookbehind的组合表达式。只有在另一个字符组之前，我们才能使用Lookahead来捕获特定的组。当我们希望在同一个字符串中查找不同的模式时，这很有用。

语法

下面的语法显示了正向的JavaScript regexp Lookahead。

X(?=Y)

以下语法显示了Javascript中负向的正则表达式Lookahead

X(?!Y)

解释

有两种不同的前瞻，分别如下：

正向前瞻：确定特定元素是否包含在搜索模式中，但不进行匹配。正向前瞻是通过在(?=和)之间添加特定模式来实现的。
负向前瞻：检查特定元素是否不存在于搜索模式中。将特定模式放在(?!和)之间可以实现负向前瞻。

示例

下面的示例展示了正向和负向前瞻的正则表达式。

示例1：

在这个示例中，“butter”使用正向前瞻表达式与“fly”或“milk”进行匹配。如果第一个值出现在最后一个值之前，则输出显示为真值。如果第一个值与最后一个值不匹配，则输出显示为假值。

<!DOCTYPE html>
<html>
<head>
<title> Javascript regexp Lookahead </title>
</head>
<body>
<h3> Javascript regexp Lookahead </h3>
<h4> Displays the similar values in the variable data using positive lookahead. </h4>
<p id = "demo_data"> </p>
<p id = "demo_data1"> </p>
<p id = "demo_data2"> </p>
<p id = "demo_data3"> </p>
<script>
let word1 = "butterfly";
let word2 = "buttermilk";
let exp = /(butter(?=fly))/;
let exp1 = /(butter(?=milk))/;
let result1 = (exp.test(word1));
let result2 = (exp.test(word2));
let result3 = (exp1.test(word1));
let result4 = (exp1.test(word2));
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>

输出

下图显示了布尔值作为输出。

JavaScript regexp向前查找

示例2:

在示例中，使用正向预查表达式，”butter”与”fly”或”milk”匹配。我们可以通过预查模式看到正则表达式，以获取所需的值。$1对于从模式中获取后续值是必不可少的。

<!DOCTYPE html>
<html>
<head>
<title> Javascript regexp Lookahead </title>
</head>
<body>
<h3> Javascript regexp Lookahead </h3>
<h4> Displays the similar values in the variable data using positive lookahead. </h4>
<p id = "demo_data"> </p>
<p id = "demo_data1"> </p>
<p id = "demo_data2"> </p>
<p id = "demo_data3"> </p>
<script>
let word1 = "butterfly";
let word2 = "soyamilk";
let exp = /(butter(?=fly))/;
let exp1 = /(soya(?=milk))/;
let result1 = (exp1.test(word2));
let result2 = (RegExp. $1); let result4 = (exp.test(word1)); 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>

输出

下图显示了数据值作为输出。

JavaScript regexp向前查找

示例3：

在这个示例中，使用负向前瞻表达式，将”butter”与”fly”或”milk”进行匹配。第一个值不在最后一个值之前。然后输出显示真值。如果第一个值与最后一个值不匹配，则输出显示假值。

<!DOCTYPE html>
<html>
<head>
<title> Javascript regexp Lookahead </title>
</head>
<body>
<h3> Javascript regexp Lookahead </h3>
<h4> Displays the similar values in the variable data using negative lookahead. </h4>
<p id = "demo_data"> </p>
<p id = "demo_data1"> </p>
<p id = "demo_data2"> </p>
<p id = "demo_data3"> </p>
<script>
let words1 = "soyafly";
let words2 = "soyamilk";
let exp = /(soya(?!fly))/;
let exp1 = /(soya(?!milk))/;
let result1 = (exp.test(words1));
let result2 = (exp.test(words2));
let result3 = (exp1.test(words1));
let result4 = (exp1.test(words2));
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>

输出

以下图像显示了布尔值作为输出。

JavaScript regexp向前查找

示例4：

在这个示例中，“butter”与“fly”或“milk”匹配，使用了负向前瞻表达式。我们可以看到具有负向前瞻模式的正则表达式，并获取输出。这个示例显示了使用$1获取所需值。从模式中获取值后，获取不可用是很重要的。

<!DOCTYPE html>
<html>
<head>
<title> Javascript regexp Lookahead </title>
</head>
<body>
<h3> Javascript regexp Lookahead </h3>
<h4> Displays the similar values in the variable data using negative lookahead. </h4>
<p id = "demo_data"> </p>
<p id = "demo_data1"> </p>
<p id = "demo_data2"> </p>
<p id = "demo_data3"> </p>
<script>
let fword = "soyafly";
let sword = "soyamilk";
let exp = /(soya(?!fly))/;
let result1 = (exp.test(fword));
let result2 = (exp.test(sword))
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>

输出：

以下图像显示了布尔值作为输出。

JavaScript regexp向前查找

示例5：

在该示例中，前瞻正则表达式用于从模式值中获取可用值。我们可以使用控制台选项卡、alert和其他输出选项卡。我们可以通过前瞻函数来使用匹配函数。在这里，输出显示了输入值之前的值。

<!DOCTYPE html>
<html>
<head>
<title> Javascript regexp Lookahead </title>
</head>
<body>
<h3> Javascript regexp Lookahead </h3>
<h4> Displays the similar values in the variable data using positive lookahead. </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 costs 40@";
let word2 = "32@ for the tutorial";
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>

输出

下图显示了布尔值作为输出。

JavaScript regexp向前查找

示例6：

在示例中，负向先行断言正则表达式用于从模式值中获取可用的值。

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

输出

下图显示了布尔值作为输出。

JavaScript regexp向前查找