[insertTag方法中存在变量名混淆导致的逻辑错误]

[zhuzhigang9081]

Issue: [insertTag方法中存在变量名混淆导致的逻辑错误]

问题描述

在Diff.ts文件的insertTag方法中，存在变量名混淆导致的逻辑错误。方法参数tag与局部变量tag使用了相同的名称，导致在某些条件下判断的不是预期的变量。

问题代码位置

insertTag(tag: string, cssClass: string, words: string[]) {
  // ...
  if (specialCaseOpeningTagRegex.test(words[0])) {
    let matchedTag = words[0].match(specialCaseOpeningTagRegex)
    let tag = '<' + matchedTag?.[0].replace(/(<|>| )/g, '') + '>'  // 局部变量tag与参数tag同名
    this.specialTagDiffStack.push(tag)
    specialCaseTagInjection = '<ins class="mod">'
    if (tag === 'del') {  // 这里判断的是局部变量tag，但格式是'<del>'，所以永远不会是'del'
      words.shift()
      while (words.length > 0 && specialCaseOpeningTagRegex.test(words[0])) {
        words.shift()
      }
    }
  } else if (specialCaseClosingTags.has(words[0])) {
    // ...
    if (tag === 'del') {  // 这里判断的是方法参数tag ('del'字符串)
      words.shift()
      while (words.length > 0 && specialCaseClosingTags.has(words[0])) {
        words.shift()
      }
    }
  }
  // ...
}

建议修复

为了避免变量名混淆，应将局部变量重命名为更具有描述性的名称：

insertTag(tag: string, cssClass: string, words: string[]) {
  // ...
  if (specialCaseOpeningTagRegex.test(words[0])) {
    let matchedTag = words[0].match(specialCaseOpeningTagRegex)
    let htmlTag = '<' + matchedTag?.[0].replace(/(<|>| )/g, '') + '>'  // 重新定义变量名称
    this.specialTagDiffStack.push(htmlTag)
    // ...
    }
}