前端展示用户名称：如何截取第二个连字符后的内容？

场景说明：通过API创建用户时，会在用户名前预先拼接另一个API返回的ID，最终存储格式为[ID1]-[ID2]-[实际用户名]；前端展示时需要去除前两个ID前缀，只显示实际用户名。

示例 #

• 输入：S20000-KDW255258-User1-User2-User3
  预期结果：User1-User2-User3
• 输入：RTW000-RWSTY3500-Testing-Testing-Testing-User
  预期结果：Testing-Testing-Testing-User

你原有代码的问题分析 #

1. Split方法：逻辑本身是正确的，但未处理字符串格式异常的情况（比如连字符不足2个），可能导致结果不符合预期；另外你将该方法注释，未实际验证。
2. 正则方法：存在语法错误——你把正则表达式用双引号包裹成了字符串（"/^.*?-.*?-(.*)$/"），导致正则引擎无法正确解析，匹配结果为null，访问[1]时会抛出错误。

正确实现方案 #

方案1：Split切片法（直观易懂）

通过split('-')将字符串按连字符拆分为数组，从索引2开始截取剩余部分重新拼接：

getUserName(userName: string) {
  const segments = userName.split('-');
  // 处理格式异常场景，连字符不足2个时返回原字符串
  if (segments.length < 3) {
    return userName;
  }
  return segments.slice(2).join('-');
}

方案2：正则匹配法（代码紧凑）

用正则精准捕获第二个连字符后的所有内容，同时处理匹配失败的边界情况：

getUserName(userName: string) {
  const match = userName.match(/^[^-]+-[^-]+-(.*)$/);
  // 匹配成功返回捕获内容，失败则返回原字符串
  return match ? match[1] : userName;
}

注：将.*?替换为[^-]+更精准，因为ID本身不含连字符，避免不必要的非贪婪匹配。

测试验证 #

将两个示例输入代入上述方法，均可得到预期输出；当输入格式异常（如OnlyOne-User或NoDashes）时，会直接返回原字符串，避免报错。

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