JavaScript正则表达式替换指定单词时首词未匹配的问题及解决方法

问题原因 #

1. 字符消耗机制导致匹配失败：原正则/([\s\!\.])(micro|microsoft|we)([\s\!\.])/gi会直接消耗目标单词前后的分隔符（空格、!、.）。比如原字符串中Microsoft后面的空格，会被当作Microsoft匹配项的结尾分隔符被消耗，导致后续We前面的空格已不存在，无法满足前置分隔符的匹配条件，因此We未被替换。
2. 无法匹配字符串首尾的目标单词：如果目标单词出现在字符串开头或结尾，原正则因为强制要求前后有分隔符，也会匹配失败。

修改方案 #

使用零宽断言（正向/反向预查）来验证前后的分隔符，这种方式不会消耗分隔符字符，仅做条件检查，同时补充字符串开头/结尾的场景：

修改后的代码：

var str="Welcome Microsoft We are Microsoft! we wehas weo in the WE world we.";
var res = str.replace(/(?<=[\s\!\.]|^)(micro|microsoft|we)(?=[\s\!\.]|$)/gi, "<em>$1</em>");
console.log(res);
// 输出结果:Welcome <em>Microsoft</em> <em>We</em> are <em>Microsoft</em>! <em>we</em> wehas weo in the <em>WE</em> world <em>we</em>.

正则规则解释 #

• (?<=[\s\!\.]|^)：反向预查，确保目标单词前是空格、!、. 或字符串开头，不消耗该字符；
• (micro|microsoft|we)：匹配目标单词，gi模式实现全局匹配且不区分大小写；
• (?=[\s\!\.]|$)：正向预查，确保目标单词后是空格、!、. 或字符串结尾，不消耗该字符；
• 替换时直接用<em>$1</em>包裹匹配到的单词即可，无需处理前后分隔符。

另外可以优化正则的冗余部分，把micro|microsoft简化为micro(soft)?，最终正则为：/(?<=[\s\!\.]|^)(micro(soft)?|we)(?=[\s\!\.]|$)/gi，效果一致且更简洁。

内容的提问来源于stack exchange，提问作者dong