我的作业中出现无限循环错误； 不知道如何修复

Question

我的任务是使用 while 循环创建一个函数，将句子中的所有 e 转换为 3，将所有 a 转换为 4。“黑客说”。 我的函数现在将浏览器置于无限循环中。 我不知道我做错了什么。

 function hackerSpeak() { var sentence2 = document.getElementById('sentence2').value; var milk = false; var counting = 0; while (!milk) { if (counting == sentence2.value) { milk = true; } else if (sentence2.charCodeAt(counting) == "e") { sentence2.replace(counting, "3") counting++; } else if (sentence2.charCodeAt(counting) == "a") { sentence2.replace(counting, "4") counting++; } else { counting++; } } document.getElementById('replaceThree').innerHTML = sentence2; }

 Function 3: Hack speak<br> <textarea id="sentence2" class="try"></textarea><br> <button onclick="hackerSpeak()">Convert!</button> <div id="replaceThree"></div>

Answer 1

你让它太复杂了。 JavaScript 中的replace方法不将索引作为参数，而是具有以下参数： string.replace(searchvalue, newvalue) 。

并且没有必要使用循环来做你所追求的事情。

您试图通过在替换方法不支持的字符串中传递字符的索引来使用替换。

不使用循环的简单解决方案

相反，为了满足您的要求，您应该使用以下脚本。

 Function 3: Hack speak<br>
    <textarea id="sentence2" class="try"></textarea><br>
    <button onclick="hackerSpeak()">Convert!</button>
    <div id="replaceThree"></div>


 <script>
 function hackerSpeak(){
  var sentence2 = document.getElementById('sentence2').value;
  document.getElementById('replaceThree').innerHTML = sentence2.replace("a","4").replace("e","3");
 }
 </script>

使用 while 循环的另一种解决方案

如果您仍然必须使用循环，请将您的代码修改为下面给出的内容。 在运行演示时可以看到演示

请注意，使用循环方法，您必须从原始句子的第一个字符开始逐个字符地重新构建句子。 变量newSentence将使用您拥有的业务规则一次构造一个字符。 这种方法在将每个字符添加到 newSentence 值时使用字符串连接。

Function 3: Hack speak<br>
    <textarea id="sentence2" class="try"></textarea><br>
    <button onclick="hackerSpeak()">Convert!</button>
    <div id="replaceThree"></div>



 <script>
 function hackerSpeak(){
  var sentence2 = document.getElementById('sentence2').value.trim();
  var milk = false;
  var counting = 0;
  var newSentence = "";
  while(milk === false){
  if(sentence2.length == 0 || counting > (sentence2.length -1)){
     milk = true;
  }
  else if(sentence2.charAt(counting)==="e"){
     newSentence =  newSentence + "3";// sentence2.replace(counting, "3")
     counting++;
  }
  else if(sentence2.charAt(counting)==="a"){
     newSentence =  newSentence + "4";//sentence2.replace(counting, "4")
     counting++;
  }
  else{
    newSentence = newSentence + sentence2.charAt(counting);
    counting++;
   }
  }//end of while loop
  document.getElementById('replaceThree').innerHTML = newSentence;
}
</script>

Answer 2

我能看到的唯一问题是退出 while 循环。 您可以将它与sentence.length进行比较，而不是使用sentence2.value

尝试以下代码退出

if(counting==sentence2.length){
     milk = true;
  }

即使在替换功能中，它也不适用于索引，您可以使用

if (sentence2.charCodeAt(counting) == "e") {
      sentence2.replace("e", "3")
      counting++;
    } else if (sentence2.charCodeAt(counting) == "a") {
      sentence2.replace("a", "4")
      counting++;
    } else {
      counting++;
    }

一旦计数器更新，它将匹配sentence2的长度并退出循环。

Answer 3

随着新替换的出现，代码将变得越来越庞大和笨拙。

// array of characters to replace and their replacments - 
// easier to extend the array to include new values without 
// forcing code become more aware 
var hackerSwaps = [
    ['a', 'e', 'o'],    // n00bspeak
    ['4', '3', '0']     // 1337sp34k
];

// args to function are id properties of sentence and output target
 function hackerSpeak(sId, outId) {
    // convenience reference 
    function get(eId) {return document.getElementById(eId);};

    // split sentence into character array
    var s = get(sId).value.split('');
    // for each pair of items in the character swapping array
    for (var j = 0; j < hackerSwaps[0].length; j++) {
        var c = hackerSwaps[0][j];  // get n00b char
        var h = hackerSwaps[1][j];  // get 1337 replacement
        // for each character in sentence
        for (var i = 0; i < s.length; i++) {
            if (s[i] == c) s[i] = h;
        }
    }
      // convert back to String and write to page
      get(outId).innerHTML = s.join('');
};

而对于 HTML...

    <form>
            <textarea id="sentence2" class="try">some content with 'a' and 'e' characters</textarea><br>
            <input type="button" onclick="hackerSpeak('sentence2', 'replaceThree');" value="Convert!" />
            <div id="replaceThree">nothing</div>
    </form>
    <p id="replaceThree"></p>