js正则问题

Question

var str = "<p><a>这是一段文字</a></p>";
var pattern = /<([a-zA-Z]+)>(.*?)<\/\1>/;
console.log(pattern.exec(str));

此代码的运行结果不太理解：

(.*?)是非贪婪模式，我觉得这部分应该只匹配到 <a>这是一段文字，但实际运行结果匹配到的是 <a>这是一段文字</a> ，多了个</a>，求解！

Answer 1

非贪婪只是说尽可能短的匹配，

如果(.?)后面不再跟东西了，那么肯定就是空字符串，因为.可以是匹配0个字符

// $2 === ''
/<([a-zA-Z]+)>(.*?)/

那如果用.+?呢

// $2 === '<'
/<([a-zA-Z]+)>(.+?)/

因为必须至少匹配一个，所以给你一个html标签头

---

但是尽可能短也是相对的。

// $2 === '<a>这是一段文字'
/<([a-zA-Z]+)>(.*?)<\/a>/

之所以(.*?)不匹配空字符串，是因为如果返回空字符串，那么中间的<a>这是一段文字就相当于凭空消失了。

所以其实你可以把贪婪模式理解成：在满足条件时匹配尽可能的短的数据

Answer 2

这个不是贪婪模式引起的，是\1这个引起的，这个表示引用前面的分组的匹配，并且这个匹配的模式和分组里面的匹配规格必须一样。所以分组匹配了a，\1就跟着匹配a.