本教程深入探讨如何利用正则表达式实现WhatsApp风格的文本格式化，包括加粗、斜体和删除线。文章将详细解析如何处理前导字符限制、起始空格限制以及符号数量等复杂规则，并通过具体的代码示例，指导读者将符号标记的文本准确转换为HTML标签，同时强调在实际应用中正则表达式的优势与局限性。
在现代即时通讯应用和内容创作平台中，通过简单的符号标记实现文本样式（如加粗、斜体、删除线）已成为一种常见且用户友好的功能。例如，WhatsApp允许用户使用星号(*)进行加粗，下划线(_)进行斜体，以及波浪线(~)进行删除线。然而，这些看似简单的规则背后，往往隐藏着一系列复杂的上下文条件，例如对前导字符、起始空格和符号数量的严格限制。本教程将指导您如何使用高级正则表达式来模拟并实现这些WhatsApp风格的文本格式化规则。
基础文本格式化规则
首先，我们来回顾一下基本的格式化符号及其对应的HTML标签：
- *文本* -> <b>文本</b> (加粗)
- _文本_ -> <i>文本</i> (斜体)
- ~文本~ -> <s>文本</s> (删除线)
对于简单的文本，我们可以使用以下正则表达式进行替换：
// 示例文本 let text = ` *这是一个粗体文本*, _这是一个斜体文本_, ~这是一个删除线文本~. `; // 替换加粗 text = text.replace(/\*(.+?)\*/g, '<b>$1</b>'); // 替换斜体 text = text.replace(/_(.+?)_/g, '<i>$1</i>'); // 替换删除线 text = text.replace(/~(.+?)~/g, '<s>$1</s>'); console.log(text); /* 输出: <b>这是一个粗体文本</b>, <i>这是一个斜体文本</i>, <s>这是一个删除线文本</s>. */
上述正则表达式中的 (.+?) 是一个非贪婪匹配组，它会匹配两个相同符号之间的任意字符，并将其捕获到 $1 中，然后用相应的HTML标签包裹。
WhatsApp风格的复杂规则与挑战
WhatsApp的格式化规则比上述基础规则更为精细，主要体现在以下几个方面：
- 前导字符限制： 并非所有字符都可以作为格式化符号的前导。例如，@*文本* 可能不会被格式化，而 , *文本* 则可以。这意味着在匹配开始符号时，需要考虑其前面的字符。
- 起始空格限制： 如果格式化符号后面紧跟着一个空格，通常不应进行格式化。例如，* 文本* 不会生效。
- 符号数量限制： 使用过多相同的格式化符号（例如 ***）可能会阻止文本被格式化，或者产生不同的解释。例如，***文本** 可能不会被识别为粗体。
解决方案：高级正则表达式的应用
为了应对这些复杂规则，我们可以引入正则表达式的负向先行断言 (Negative Lookahead) 和负向后行断言 (Negative Lookbehind)。
负向先行断言 (?!...) 确保在当前匹配位置之后不出现指定的模式。 负向后行断言 (?<!...) 确保在当前匹配位置之前不出现指定的模式。
以下是针对加粗、斜体和删除线，并考虑部分WhatsApp风格规则的正则表达式示例：
var string = `
These should pass:
*this text is bold*,
_this text is italic_,
~this text is strikethrough~.
~_*this text is bold, italic and strike-through*_~
And, these should fail (based on specific rules):
@*this text is not bold* (前导字符限制)
* this text is not bold* (起始空格限制)
_ example_ (不完整的下划线匹配)
{*example*} (前导字符限制)
example* (不完整的星号匹配)
`;
// 1. 处理加粗 (*文本*)
// (?<![{[?}\]]) 负向后行断言：确保在 * 符号前面没有 {, [, ?, } 或 ]。
// (?!\s) 负向先行断言：确保在 * 符号后面没有空白字符。
// (.+?) 非贪婪匹配，捕获中间的文本。
string = string.replace(/(?<![{[?}\]])\*(?!\s)(.+?)\*/g, '<b>$1</b>');
// 2. 处理斜体 (_文本_)
// 规则同加粗，只是替换符号为 _
string = string.replace(/(?<![{[?}\]])_(?!\s)(.+?)_/g, '<i>$1</i>');
// 3. 处理删除线 (~文本~)
// 规则同加粗，只是替换符号为 ~
string = string.replace(/(?<![{[?}\]])~(?!\s)(.+?)~/g, '<s>$1</s>');
console.log(string);代码解析：
- (?<![{[?}\]])：这是一个负向后行断言。它确保在匹配的 *、_ 或 ~ 符号之前，不会出现字符 {、[、?、} 或 ]。这模拟了WhatsApp中某些前导字符会阻止格式化的规则。请注意，这只是一个示例，WhatsApp实际允许或禁止的前导字符列表可能更复杂，需要根据实际情况调整此断言中的字符集。
- (?!\s)：这是一个负向先行断言。它确保在匹配的 *、_ 或 ~ 符号之后，不会立即出现一个空白字符。这解决了 * 文本* 这种起始带空格不应格式化的问题。
- (.+?)：这是一个非贪婪匹配模式，它会匹配任意字符（除了换行符）一次或多次，直到遇到下一个匹配的格式化符号。$1 则引用了这个捕获组中的内容。
- 连续替换： 对于像 ~_*this text is bold, italic and strike-through*_~ 这样的嵌套或组合样式，通过依次执行加粗、斜体和删除线的替换操作，可以实现多重样式的正确应用。例如，先将 *this text is bold, italic and strike-through* 转换为 <b>...</b>，然后将 _<b>...</b>_ 转换为 <i><b>...</b></i>，最后将 ~<i><b>...</b></i>~ 转换为 <s><i><b>...</b></i></s>。
注意事项与限制
- 正则表达式的局限性： 尽管正则表达式功能强大，但对于极端复杂的、依赖于深层上下文的规则（例如，需要解析整个语法树的规则），可能会变得非常复杂且难以维护。例如，严格处理 *** 这种多余符号的规则，可能需要更精细的模式或多步处理。
- 前导字符列表的完整性： 示例中的 (?<![{[?}\]]) 仅涵盖了部分限制。在实际应用中，您需要根据WhatsApp或其他平台的具体规则，详尽列出所有允许或禁止的前导字符。
- 性能考量： 对于非常大的文本字符串，多次执行复杂的正则表达式替换操作可能会带来一定的性能开销。
- 嵌套顺序： 尽管本示例中的独立替换可以处理多重嵌套，但在某些情况下，替换的顺序可能会影响最终结果。通常，建议从最内层或最外层开始，或者根据特定的需求来确定替换顺序。
- 未完全覆盖的规则： 本教程提供的解决方案侧重于处理前导字符和起始空格限制。对于诸如“超过两个相同符号不格式化” (***text** 不变) 或 **text** 转换为 <b>*text*</b> 等特殊规则，需要更复杂的正则表达式模式，可能涉及更高级的捕获组、条件匹配或分步处理逻辑。例如，要处理 **text** 转换为 <b>*text*</b>，可能需要一个先匹配 ** 的模式，然后在其内部再匹配 *。
总结
通过灵活运用正则表达式的负向先行断言和负向后行断言，我们可以有效地模拟WhatsApp等应用中复杂的文本格式化规则。这些高级特性使得正则表达式能够处理更精细的上下文条件，从而实现更准确的文本转换。然而，在设计和实现时，务必充分理解目标平台的具体规则，并权衡正则表达式的复杂性与可维护性，必要时可结合其他文本处理技术来达到最佳效果。
