在处理字符串拆分时，有一个容易忽略的技术细节：默认情况下，split() 方法会直接舍弃分隔符，仅保留被分割后的各个片段。但在许多实际场景中——比如解析日志信息、处理特定格式的文本，或者实现语法高亮——我们恰恰需要将这些分隔符一并保留。此时，借助带捕获组的正则表达式就能高效解决问题。
简单来说，秘诀就在于：给正则表达式加上括号。一旦正则中包含捕获组 ()，JavaScript 引擎就会将匹配到的分隔符作为独立元素插入到结果数组中，紧跟在它所分割出的内容后面。
核心原理：捕获组如何“保住”分隔符
这一机制的原理相当直观。没有括号时，split() 只负责找到切割位置，切割完成后就会丢弃分隔符。而一旦使用了捕获组，引擎会认为：“括号内的内容也需要被记录。”因此，它在执行分割的同时，会将每次匹配到的分隔符单独提取出来，并按顺序放入结果数组。
请看以下对比：
"a,b;c".split(/[,;]/)返回["a", "b", "c"]—— 逗号和分号被移除。"a,b;c".split(/([,;])/)返回["a", ",", "b", ";", "c"]—— 每个分隔符都作为独立项被保留。
应对复杂场景：多个分隔符与模式匹配
这个技巧具有很强的实用性。无论是处理多个分隔符，还是更复杂的匹配模式，只需加入捕获组即可生效。
- 保留空格或等号：解析“key = value”这类字符串时，
"key = value".split(/(\s+|=)/)会得到["key", " = ", "value"]，连空格加等号一并留住。 - 简单匹配 HTML 标签：对于
"abcdefghi"，使用.split(/(<\/?[^>]+>)/)可拆分为["abc", "", "def", "", "ghi"]，标签与文本分离，便于后续处理。 - 注意非捕获组：若你只想用括号进行分组而不希望保留内容，务必使用非捕获组语法
(?:...)，这样匹配的内容就不会被注入结果数组中。
结果清理：处理空字符串与结构重组
使用捕获组后，可能会产生一些“副产品”。例如，当字符串以分隔符开头或结尾，或者分隔符连续出现时，结果数组中会出现空字符串 ""。
举例来说，"|a|b|".split(/(\|)/) 会返回 ["", "|", "a", "|", "b", "|", ""]，开头和结尾的空字符串属于多余元素。
此时，只需使用 .filter(Boolean) 即可去除它们：["", "|", "a", "|", "b", "|", ""].filter(Boolean) 的结果为 ["|", "a", "|", "b", "|"]。
当然，若你需要保持“内容-分隔符-内容”的清晰结构，则可能需要借助 reduce 或循环来手动重组数组，这能为你提供更大的控制灵活性。
另一种思路：直接用 match 或许更清晰
当拆分逻辑变得复杂（比如需要区分不同类型的分隔符，或要对匹配内容进行预处理）时，放弃 split() 转而使用 match() 方法可能更加直观且易于维护。
核心思路是编写一个能同时匹配“非分隔符内容”和“分隔符本身”的正则表达式，然后用 match() 一次性提取所有片段。
- 例如：
"a,b;c".match(/[^,;]+|[,;]/g)同样可以得到["a", ",", "b", ";", "c"]。 - 这个正则
/[^,;]+|[,;]/g的含义是：匹配“一个或多个非逗号/分号的字符”或者匹配“一个逗号或分号”。这样能确保覆盖字符串的每一个部分，且天然保留了分隔符。
这种方法的优势在于逻辑外显，一目了然。你无需依赖 split() 那种“遇到捕获组就保留”的隐式行为，正则表达式本身直接声明了你要匹配的内容。代码更易调试，也更便于扩展以适应更复杂的业务需求。
