如何用Javascript中的唯一值替换文本中的不同单词？

Question

我想使用 RegExp() javascript 函数将文本中的许多单词（或短语）替换为相同的值。它用正确的值替换单数单词，但是当它必须替换包含相同单词的短语时，它不起作用（我想知道它是如何工作的）。

在我的文本中，例如我想用相同的值替换 activity 和 Weekly activity minutes：

"活动患者对应每周活动分钟数"

但它只是替换活动

我是怎么做的：

我有一个 keywords.js 文件，我可以在其中获取结构如下的对象中的所有短语：

let keywords: {
    "activity": {
        phrases: ['activity']
    },
    "sleep": {
        phrases: ['sleep']
    }
}

在我的 html 中的 javascript 部分：

@section('javascript')
    <script type="application/javascript" src="{{ asset("js/keywords.js") }}"></script>
    <script>
    $(function () {
       @if($patient)
          let patient = {
              weight: 60,
              height: 70,
              'currents' : {
                  "activity" : 100,
                  "sleep" : 60
              },
          }
          let t = $("#text-section-article").html(t); //the text where i want to look for word/phrases

          Object.entries(keywords).forEach(([key, values])=>{
          //Im iterating all over the keywords words
              Object.entries(values).forEach(([phraseKey, phraseValue])=>{
              //Im iterating all over the phrases
                  if(patient.currents.hasOwnProperty(key)){
                  //If my patient have activity in my object 'currents' I put a tooltip to that word in my body text by replacing it in this way.
                  title = `Your current ${phraseValue} is ${patient.currents[key]}`; //Your current activity is 100
                  t = t.replace(new RegExp(key, 'gi'), '<span data-toggle="tooltip" title="' + title + '" class="tip ' + phraseValue + '">' + phraseValue + '</span>');
                  }
              });       
       });
       $("#text-section-article").html(t);
       @endif
    });
    </script>
@endsection

在这种情况下，在我的文章文本中，所有 activity 词现在都有一个工具提示，显示其当前值。

我想要做的是添加更多的单词和短语到我的关键字对象中：

let keywords: {
    "activity": {
        phrases: ['activity', 'Weekly activity minutes']
    },
    "sleep": {
        phrases: ['sleep', 'Sleep minutes']
    }
}

用相同的患者对象值替换我文章文本中的所有这些短语（如果它们存在）。

我对此感到很不愉快，如果您能帮助我找到一种方法来管理我所描述的所有内容，并且如果有一种简单/更好的方法来处理它，请告诉我，我将不胜感激。

感谢阅读！

Answer 1

我不确定是否可以使用正则表达式，但您可以执行以下操作：

首先，您需要将短语从最长到最短排序。这样，您首先收集所有可能包含较短短语的短语。所以如果你有

['activity', 'Weekly activity']

应该变成

['Weekly activity', 'activity']

然后，您需要将原始字符串拆分为一个数组，以便您可以迭代并查找短语。

['The', 'activity', 'patient', 'is', 'correspond', 'to', 'Weekly', 'activity', 'minutes']

我们的想法是将原始数组转换为：

['The', 'activity', 'patient', 'is', 'correspond', 'to', 'Weekly activity minutes']

我们不再有单独的单词，而是短语。在查找这些短语时，您还应该记录可以在结果数组中找到该短语的索引。

此时，您需要做的就是遍历结果数组，检查您是否记录了当前短语的索引，如果是，则用<span> 元素包装它，如果没有，您只需跳过它。最后一步是将结果中的每个短语连接成一个字符串。

这里是 jsfiddle 演示：https://jsfiddle.net/tara5/43gcz0mx/

有点粗糙，可以优化词组搜索，减少迭代次数。