基于正则表达式计算输入框剩余可输入最大字符数的实现求助

云原生阿岚

2026-4-9

我正在开发一个Angular掩码输入组件，组件里把输入拆成了多个分段输入框，每个分段对应固定掩码分隔符，且每个输入框都有对应的正则校验规则。为了实现输入框的自动适配宽度，我需要知道用户当前还能输入多少字符：不仅要在输入过程中动态调整宽度，初始状态下输入框就要匹配预期的最大输入长度，输入时则要根据已输入内容+剩余可输入的最大长度来更新宽度。

目前我已经通过refa的AST解析实现了获取正则表达式允许的最大输入长度的逻辑，对于无上限的量词（比如a*），我会给它设一个固定上限值（比如5）。这段代码目前运行正常，先贴出来给大家参考：

private getMaxLength(pattern: RegExp): number {
  const { expression } = JS.Parser.fromLiteral(pattern).parse();
  return Math.max(
    0,
    ...expression.alternatives.map(concat => this.maxConcatenationLength(concat))
  );
}

private maxNodeLen(node: Element): number {
  switch (node.type) {
    case 'CharacterClass':
      return 1;
    case 'Quantifier': {
      const q = node;
      const capMax = q.max === Infinity ? this.UNBOUNDED_CAP : q.max;
      // 每个量词内部应该只有一个串联节点
      const innerConcatenation = q.alternatives[0];
      const innerMax = this.maxConcatenationLength(innerConcatenation);
      return innerMax * capMax;
    }
    case 'Alternation':
      return Math.max(
        ...node.alternatives.map((a: any) => this.maxConcatenationLength(a))
      );
    default:
      // 跳过断言和未知类型节点
      return 0;
  }
}

private maxConcatenationLength(concat: Concatenation): number {
  return concat.elements.reduce((s: number, e: Element) => s + this.maxNodeLen(e), 0);
}

举几个测试用例，结果都是符合预期的：

/^ba*b$/ 返回7（因为a*被上限为5，总长度1+5+1=7）
/^a*b$/ 返回6（5+1=6）
匹配UUID的正则返回36，完全符合预期

现在我遇到了卡点：我需要根据用户已经输入的字符串，计算出当前还能输入的最大字符数。比如正则是a*a，用户已经输入了aa，在无上限量词被设为5的情况下，剩余可输入的最大字符数应该是4（因为正则允许的总最大长度是5+1=6，已输入2，6-2=4）。

之前的最大长度计算逻辑只关注正则本身的结构，完全不考虑已输入内容；而现在我需要把已输入字符串和正则的结构结合起来，找到当前已输入内容对应的正则匹配进度，再推导出剩余的最大可输入长度。我尝试在现有逻辑上扩展，但一直没找到正确的方向，想请教各位大佬，该怎么修改或扩展现有的AST解析逻辑，来实现这个需求？

内容来源于stack exchange