Как сгенерировать алфавит в правильном порядке?

#javascript

#javascript

Вопрос:

Мне удалось перебрать алфавитный массив, но в случайном порядке, когда я нажимаю кнопку прокрутки. Как я могу перебирать массив, но в правильном порядке, и когда он достигает точки Z, снова начинать с начала без остановки.

 function roll() {
  var alphabet = [
    "A",
    "B",
    "C",
    "D",
    "E",
    "F",
    "G",
    "H",
    "I",
    "J",
    "K",
    "L",
    "M",
    "N",
    "O",
    "P",
    "Q",
    "R",
    "S",
    "T",
    "U",
    "V",
    "W",
    "X",
    "Y",
    "Z",
  ];

  setInterval(function () {
    for (i = 0; i < alphabet.length; i  ) {
      document.querySelector("span").innerHTML =
        alphabet[Math.floor(Math.random() * alphabet.length)];
    }
  }, 800);
}  
 <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="style.css" />
    <title>Document</title>
  </head>
  <body>
    <div class="main">
      <span></span>
      <button id="roll" onclick="roll()">roll</button>
    </div>
    <script src="main.js"></script>
  </body>
</html>  

Комментарии:

1. вы создадите бесконечный цикл, это приведет к тому, что браузеру не хватит памяти

2. хорошо, тогда я создам кнопку, которая будет останавливаться всякий раз, когда я захочу

3. Что именно вы пытаетесь сделать? Насколько я понимаю, вы хотите перебирать массив случайным образом, а затем, когда он, наконец, достигнет «Z», продолжать перебирать его в обычном режиме? Я пытаюсь понять прецедент здесь.

4. ах, извините, если я не правильно объяснил, я не хочу, чтобы это было случайным образом, я хочу, чтобы это было в порядке массива. Приведенный выше код приведен случайным образом, но я не хочу, чтобы это было так

5. Также innerHTML = alphab….

Ответ №1:

   function roll() {
      var i=0;
      var alphabet = [
        "A",
        "B",
        "C",
        "D",
        "E",
        "F",
        "G",
        "H",
        "I",
        "J",
        "K",
        "L",
        "M",
        "N",
        "O",
        "P",
        "Q",
        "R",
        "S",
        "T",
        "U",
        "V",
        "W",
        "X",
        "Y",
        "Z",
      ];
    
      setInterval(function () {
        if (i == alphabet.length){
          i=0;   
        }
        document.querySelector("span").innerHTML =  alphabet[i];
        i  ;        
      }, 800);
    }  
     <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <link rel="stylesheet" href="style.css" />
        <title>Document</title>
      </head>
      <body>
        <div class="main">
          <span></span>
          <button id="roll" onclick="roll()">roll</button>
        </div>
        <script src="main.js"></script>
      </body>
    </html>