首页 > 解决方案 > 替换 JS 字符串中的所有且仅完整的单词(不是嵌套单词)

问题描述

我想替换用户上传的文本文件中的单词。所以我不知道文本的确切结构或将替换哪些单词。
要替换的单词将是在用户文本中出现次数最多的单词。
但是我发现我当前使用.replace()withnew RegExp()替换全局和不区分大小写 (gi) 的方法存在一些问题。这行得通。

我的问题是当较长的单词或名称包含我要替换的单词时。
例如:我想在“This is Isak”这个短语中将“is”替换为“xx”。

我想要:“这个 xx Isak”。
但我得到:“Thxx xx xxak”。

所以我尝试用“是”替换(忽略任何嵌套的单词)。
但这有它自己的问题。

如果该词在“is is is”旁边多次出现,则结果将是“xx is xx”而不是“xx xx xx”。(因为第二个“是”的左侧没有空格?)
或者如果它在点或逗号旁边“就是这样,就像这样”。结果将是:“就是这样。”
但我想要:“那个xx,像这样。”

我搜索了 stackoverflow 和 google,但只能找到相关问题的答案,而不是如何解决这个“嵌套词”问题。
有任何想法吗?

<p id="demo"></p>

<script>

function myFunction() {
  // colors are only to make it clear for everyone what is replaced
  var str = "thisandthat, is, this is isak. Is it Isak is is is it?"
  var regexp = new RegExp(/is/, 'gi')
  // I tried finding and replacing with spaces to make sure I don't get the "is"-part of "this"
  // var regexp_withSpaces = new RegExp(/ is /, 'gi')
  // var replaceWith_withSpaces = ' <span style="color:blue">xx</span> '
  var replaceWith = '<span style="color:blue">xx</span>'
  var currentResult = str.replace(regexp, replaceWith)
  document.getElementById("demo").innerHTML =
  '<b>Original text:</b><br>' +
  str +
  '<br><br><b>Current results:</b><br>' +
  currentResult
}

myFunction()

</script>
<!-- Next part is to show expected and actual results. -->
<!-- Colors only to show what parts are wrong and what parts are wanted. -->
<p style="margin-top: 4rem">
  <b style="color:red">A. Wrong results (with RegExp replace function):</b>
  <br>
  th<span style="color:red">xx</span>andthat, <span style="color:green">xx</span>, th<span style="color:red">xx</span> <span style="color:green">xx</span> <span style="color:red">xx</span>ak. <span style="color:green">xx</span> it <span style="color:red">xx</span>ak <span style="color:green">xx</span> <span style="color:green">xx</span> <span style="color:green">xx</span> it?
</p>

<p>
  <b style="color:red">B. Wrong results (with spaces in RegExp replace function):</b>
  <br>
  thisandthat, <span style="color:red">is</span>, this <span style="color:green">xx</span> isak. <span style="color:green">xx</span> it Isak <span style="color:green">xx</span> <span style="color:red">is</span> <span style="color:green">xx</span> it?
</p>

<p>
  <b style="color:green">Wanted results:</b>
  <br>
  thisandthat, is, this <span style="color:green">xx</span> isak. <span style="color:green">xx</span> it Isak <span style="color:green">xx</span> <span style="color:green">xx</span> <span style="color:green">xx</span> it?
</p>

标签: javascriptreplacenestedword

解决方案


您想添加一个单词边界以确保您只替换一个单词而不是单词的一部分。

  ...
    function myFunction() {
  // colors are only to make it clear for everyone what is replaced
  let str = "thisandthat, is, this is isak. Is it Isak is is is it?"
  var regexp = new RegExp(/\bis\b/,'gi')
    ...

推荐阅读