Блог

Моя задача — создать функцию, использующую циклы 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>  

Вы делаете это слишком сложным. replace Метод в JavaScript не принимает индекс в качестве параметра, но имеет следующие параметры: string.replace(searchvalue, newvalue) .

И нет необходимости использовать цикл для выполнения того, что вам нужно.

Вы пытаетесь использовать replace, передавая индекс символа в строке, которая не поддерживается методом replace.

Простое решение без использования цикла

Вместо этого, чтобы соответствовать вашим требованиям, вам следует использовать следующий скрипт.

  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

Если вам все еще приходилось использовать цикл, то измените свой код на то, что приведено ниже. Демонстрационную версию можно посмотреть на странице running demo

Обратите внимание, что при циклическом подходе вам приходится перестраивать предложение посимвольно, начиная с первого символа в исходном предложении. Переменная 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>
  

Единственная проблема, которую я смог увидеть, — это выход из цикла while. Вместо использования sentence2.value вы можете сравнить его с предложением.длина

попробуйте приведенный ниже код для выхода

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

даже в функции replace это не работает с индексацией, вы можете использовать

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

как только счетчик будет обновлен, он будет соответствовать длине предложения2 и завершит цикл.

Код будет становиться все более большим и неуклюжим по мере появления новых замен.

 // 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>