使用Regex与JS提取括号后指定单词并拼接结果

需求说明 #

给定标签数组：

const Tags = ['Tag1', 'Tag2', 'Tag3', 'Tag4', 'Tag5'];

需从数据库返回的字符串中按以下规则提取内容：

• 提取[X]后紧邻的单词（包含ä、ë、ü、ö）
• 提取标签数组中任一标签后的单个/多个单词（包含ä、ë、ü、ö），允许中间穿插其他括号
• 将两类提取结果拼接为一个字符串

实现代码 #

// 定义标签数组
const Tags = ['Tag1', 'Tag2', 'Tag3', 'Tag4', 'Tag5'];
// 示例输入字符串（可替换为数据库返回的实际字符串）
const inputStr = '[UnRelatedTag][X]sunset[Y]beach[Tag1][UnrelatedTag]paintball[UnrelatedTag][UnrelatedTag][UnrelatedTag]yacht';

// 提取[X]后的目标单词
const xWordMatch = inputStr.match(/\[X\]([a-zA-Zäëüö]+)/);
const xTargetWord = xWordMatch ? xWordMatch[1] : '';

// 生成匹配标签的正则模式
const tagRegexPattern = `\\[(${Tags.join('|')})\\]`;
// 全局匹配标签后跳过任意括号内容的单词
const tagWordsRegex = new RegExp(`${tagRegexPattern}(?:\\[.*?\\])*([a-zA-Zäëüö]+)`, 'g');
const tagTargetWords = [];
let currentMatch;
// 遍历所有匹配结果
while ((currentMatch = tagWordsRegex.exec(inputStr)) !== null) {
  tagTargetWords.push(currentMatch[2]);
}

// 拼接并输出结果（过滤空值，避免无匹配时出现多余分隔符）
const finalResult = [xTargetWord, ...tagTargetWords].filter(Boolean).join(', ');
console.log(finalResult);

正则说明 #

1. 提取[X]后的单词：
   正则/\[X\]([a-zA-Zäëüö]+)/

   • \[X\]精准匹配[X]字符串
   • ([a-zA-Zäëüö]+)捕获后续的单词，包含指定的特殊元音字符

2. 提取标签后的单词：
   动态生成的正则（以Tag1-Tag5为例）：/\[(Tag1|Tag2|Tag3|Tag4|Tag5)\](?:\[.*?\])*([a-zA-Zäëüö]+)/g

   • \[(Tag1|Tag2|Tag3|Tag4|Tag5)\]匹配标签数组中的任意一个标签
   • (?:\[.*?\])*非捕获组，匹配零个或多个任意括号包裹的内容（跳过中间无关括号）
   • ([a-zA-Zäëüö]+)捕获后续的目标单词
   • g修饰符开启全局匹配，确保找到所有符合条件的单词

示例测试 #

• 示例1输入：[UnRelatedTag][X]sunset[Y]beach[Tag1][UnrelatedTag]a[UnrelatedTag][UnrelatedTag][UnrelatedTag]
  输出：sunset, a
• 示例3输入：[UnRelatedTag][X]sunset[Y]beach[Tag1][UnrelatedTag]paintball[UnrelatedTag][UnrelatedTag][UnrelatedTag]yacht
  输出：sunset, paintball, yacht
• 示例4输入：[UnRelatedTag][X]sunset[Y]beach[Tag1]snowball
  输出：sunset, snowball

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