Javascript程序冻结并导致页面在处理大量文本时刷新

时间:2018-01-19 22:54:47

标签: javascript web-deployment

好吧所以我对JavaScript和Stack Overflow很新。我还在上高中,但我一直在使用Java和其他一些语言。请给我任何反馈意见。

所以我最近开始学习JavaScript而且我正在做一个项目,你可以像文章或其他东西一样给程序文本,然后给它关键词,它会返回文本中提到这些词的区域。我已经在java中构建了这个,但是我想让它基于web并且已经相当远,但是我在加载时遇到了问题。基本上当我用大量文本运行它时会冻结一段时间然后最终只刷新页面并清除文本字段中的数据。这是代码:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">

  <textarea id="input" rows="8" cols="100" ></textarea><br/>
  <textarea id="keywords" rows="1" cols="50"></textarea><br/>
  <textarea id="output" rows="8" cols="100"></textarea><br/>
  <button id="read">READ!</button><br />


  <script type="text/javascript">
    document.getElementById('read').onclick = function(event) {
      var input = document.getElementById('input').value.split(" ");
      var keywords = document.getElementById('keywords').value.split(" ");
      var found = ""; 

      alert(input.length + "  " + keywords.length);
      for(i = 0; i < input.length; i++){
        for(j = 0; j < keywords.length; j++){
          if(input[i].toLowerCase().includes(keywords[j].toLowerCase())){
            if(i >= 25 && input.length >= i + 40){
              for(a = i- 25; a <= a + 40; a++){
                found = found + input[a];
              }
            }else{
              var length = input.length - i;
              for(a = 0; a < length; a++){
                found = found + input[a];
              }
            }
            found += "\n\n";
          }
        }
      }
      output.value = found;
    }
  </script>


</head>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

循环

label

是一个无限循环。 for始终小于for(a = i- 25; a <= a + 40; a++){ outputs.push(input[a]); } 。你可能想说a。但是你选择输出的单词仍然很奇怪,如果不是说错误的话。假设您输入的是10个单词,并且您在第7个单词中匹配。然后你的程序输出前3个单词 - 不包括匹配本身。您可能希望在匹配之前打印x个单词,在匹配之后打印y个单词,但前提是有足够的单词可供选择。为此,您可以使用最小和最大函数(请参阅下面的代码)。

当您想要提高较大文本的性能时,其他一些重要的事情是:

  1. 每当你用+ =连接一个字符串时,新的一个新对象 内存地址已创建,这很糟糕。存储您想要的单词 在数组中输出并使用a + 40将其连接到最后。

  2. 您在同一个字符串上多次调用i + 40。如果您有足够的存储空间,请存储每个单词的小写版本并重复使用它们。

  3. 在下面的代码中,我修复了这些问题。结果绝不是最佳的。

    join()