ES12 中的 RegExp 懒惰量词

正则表达式是前端开发中非常重要的一部分，它可以帮助我们进行字符串匹配和替换等操作。在 ES12 中，新增了懒惰量词，可以更加方便地进行正则匹配操作。

懒惰量词是什么？

懒惰量词也叫惰性量词，是指在匹配字符串时，尽可能少地匹配字符。在正则表达式中，懒惰量词用问号（?）表示。

与懒惰量词相对应的是贪婪量词，它们在匹配字符串时，尽可能多地匹配字符。贪婪量词在正则表达式中默认是开启的。

懒惰量词的语法

懒惰量词的语法非常简单，只需要在正则表达式中添加一个问号即可。例如：

const str = 'Hello, world!';
const lazyRegex = /l.*?o/; // 使用懒惰量词
const greedyRegex = /l.*o/; // 使用贪婪量词

console.log(str.match(lazyRegex)); // 输出 ['lo']
console.log(str.match(greedyRegex)); // 输出 ['llo, world']

在上面的示例中，我们使用了两个正则表达式，一个使用了懒惰量词，另一个使用了贪婪量词。通过输出结果可以看到，使用懒惰量词时，只匹配了一个“lo”，而使用贪婪量词时，匹配了整个字符串中的“llo, world”。

懒惰量词的应用场景

懒惰量词在正则表达式中的应用场景非常广泛，主要是针对需要匹配多个字符的情况。例如，我们需要匹配一个 HTML 标签中的所有属性，可以使用懒惰量词来匹配：

const html = '<div class="container" id="main">Hello, world!</div>';
const attrRegex = /(\w+)\s*=\s*"(.*?)"/g;

let match;
while ((match = attrRegex.exec(html))) {
  console.log(match[1], match[2]);
}

在上面的示例中，我们使用了一个正则表达式来匹配 HTML 标签中的属性。正则表达式中使用了懒惰量词来匹配属性值，这样可以避免匹配到其他属性的值。

总结

懒惰量词是 ES12 中新增的一个正则表达式语法，可以更加方便地进行字符串匹配操作。在实际开发中，我们可以根据需要选择使用懒惰量词或贪婪量词来进行字符串匹配。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/66362a27d3423812e4408b0b