类抖音#话题发布视频功能开发 字符串检索标签（#开头特殊字符结尾）javascript

需求：

将随机字符串（用户手动输入的），例如 "#好的话的哈哈 #哈哈哈,和大河 #很多哈哈的&#开导开导可#好的话的哈哈呵呵呵 #可控####123"

检索出以 "#" 开头，以 "～＠#￥$％&×－＝＋·_+~*÷ ，。、；！‘’【】、《》？：“”「」|（）……—— ,./;'[] \\ <>?:\"{}|!()…— " 结尾的标签,以标签形式展示在后台；

let allStr = "#好的话的哈哈 #哈哈哈,和大河 #很多哈哈的&#开导开导可#好的话的哈哈呵呵呵 #可控####123";
function searchTags(allStr) {
  let startStr = "#";	//以#开头
  let endStr = "～＠#￥$％&×－＝＋·_+~*÷   ，。、；！‘’【】、《》？：“”「」|（）……——   ,./;'[] \\ <>?:\"{}|!()…—    ";   //以特殊符号结尾
  let start = 0;  //开始的下标
  let end = 0;	//结束的下标
  let isStart = false;	//是否可以截取
  let subStr = [];	//最终保存的数组
  for (i = 0; i < allStr.length; i++) {
    //默认不是开始，从第一个下标开始走
    if (!isStart) {
      //如果下标为i的字符是#
      if (allStr[i] == startStr) {
        //则让开始下标为i，则给状态可以截取
        start = i;
        isStart = true;
      }
    } else {
      //如果已经是可以截取状态，则查找特殊字符
      if (endStr.indexOf(allStr[i]) > -1) {
        //如果查到特殊字符将下标赋值给end
        end = i;
        //截取状态关闭
        isStart = false;
        //只有开始和结束中间有字符才截取
        if (end - start > 1) {
          subStr.push({
            start,
            length: end - start,
            subStr: allStr.slice(start, end + 1)
          })
        }
      }
    }
    //如果这次的结束字符也是#，并且下标大于0
    if (allStr[end] == startStr && end > 0) {
      //则这次的下标就是下次可以截取的开始下标
      start = end;
      isStart = true;
    }
  }
  //如果循环结束还是可以截取状态，证明有开始没结尾，最后有一个正确的标签，则单独处理
  if (isStart) {
    //截取最后所有的字符
    let strSubEnd = allStr.substring(start);
    //如果字符大于0则push进数组
    if (strSubEnd.length > 0) {
      subStr.push({
        start,
        length: allStr.length - start,
        subStr: allStr.slice(start)
      })
    }
  }

  return subStr;
}
let subStr = searchTags(allStr);

结果如下：

[
  {start: 0, length: 7, subStr: "#好的话的哈哈 "}
  {start: 8, length: 4, subStr: "#哈哈哈,"}
  {start: 17, length: 6, subStr: "#很多哈哈的&"}
  {start: 24, length: 6, subStr: "#开导开导可#"}
  {start: 30, length: 10, subStr: "#好的话的哈哈呵呵呵 "}
  {start: 41, length: 3, subStr: "#可控#"}
  {start: 47, length: 4, subStr: "#123"}
]

拿到这样的结果可以显示和抖音类似将话题改变颜色，如果单独显示标签的话，在截取的时候就可以去头去尾的截取