如何在JavaScript中不使用正则和replace删除两指定字符间的字符串

核心逻辑 #

不使用正则和replace方法的前提下，我们可以通过下标遍历字符串+区间标记的方式完成注释删除，具体逻辑如下：

• 预先定义需要匹配的注释起始标签/<em>和结束标签</em>/
• 用布尔变量标记当前是否处于注释区间内，只有处于区间外的字符才会被保留到最终结果中
• 遍历过程中每次优先校验当前位置是否匹配起始/结束标签，匹配成功则直接跳转到标签末尾的下标，避免逐个字符匹配的误差

完整实现代码 #

import { Component } from 'react';

class Inpute extends Component{
  constructor(props){
    super(props);
    this.state = {
      fileName: '',
      fileContent: ''
    };
  }

  // 移除/<em>和</em>/之间的注释
  removeEmComment = (content) => {
    const startTag = '/<em>';
    const endTag = '</em>/';
    const startLen = startTag.length;
    const endLen = endTag.length;
    const contentLen = content.length;
    let result = '';
    let inComment = false;
    let i = 0;

    while (i < contentLen) {
      if (!inComment) {
        // 优先校验是否匹配注释起始标签
        if (i + startLen <= contentLen && content.slice(i, i + startLen) === startTag) {
          inComment = true;
          i += startLen;
          continue;
        }
        // 不在注释区间，保留当前字符
        result += content[i];
        i++;
      } else {
        // 优先校验是否匹配注释结束标签
        if (i + endLen <= contentLen && content.slice(i, i + endLen) === endTag) {
          inComment = false;
          i += endLen;
          continue;
        }
        // 在注释区间，跳过当前字符
        i++;
      }
    }
    return result;
  }

  handleFile = e =>{
    const file = e.target.files[0];
    const reader = new FileReader();
    reader.readAsText(file);
    reader.onload = () => {
      let processedContent = reader.result;
      // 先处理单行//注释
      if(processedContent.includes('//')){
        processedContent = processedContent
                .split('\n')
                .filter(x => !x.includes('//'))
                .join('\n')
      }
      // 再处理em标签包裹的注释
      processedContent = this.removeEmComment(processedContent);
      this.setState({fileName: file.name, fileContent: processedContent})
    }
    reader.onerror = () =>{
      console.log('File Error : ', reader.error)
    }
  }
}

注意事项 #

• 你当前的单行注释处理逻辑是直接删除整行包含//的内容，如果需要保留行内//之前的有效内容，可以将filter逻辑替换为按//分割取第一项再拼接换行即可
• 标签匹配的逻辑严格区分大小写，如果需要兼容大小写格式的标签，可以在匹配时统一转成小写再对比

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