Question

我正在尝试混合初始字符串并随机地将字符串的元素与右侧索引上的正确元素进行比较，如果为true则将它们推入集合中，以重建初始字符串。这样做我遇到了问题，即while循环没有什么只是破坏浏览器。帮助我解决这个问题。

function checker() {
  var text = document.getElementById("inp").value;
  var a = [];
  var i = 0;

  while (a.length < text.length) {
    var int = setInterval((function() {
      var rnd = Math.floor(Math.random() * text.length);
      if (text[rnd] === text[i]) {
        a.push(text[rnd]);
        clearInterval(int);
        i++;
      }
    }), 100)
  }
}

P.S。我需要setInterval（）函数，因为我需要在完全相同的时间段内完成该过程。

Answer 1

老实说，我不知道你在这里想做什么，但你似乎已经忘记了你的代码是如何运作的。

你所有的while循环都是创建间隔，它是从循环本身异步运行的。换句话说，while条件等同于假的唯一方式，是经过多个100毫秒间隔后。当将它与1循环迭代的速度进行比较时，100毫秒是永恒的。我们会在您的第一个setInterval偶数触发器之前查看1000次迭代，而不是浏览器可以跟上的情况，更不用说在更改a.length之前等待其中几个时间间隔。

尝试更多：

function checker() {
  var text = document.getElementById("inp").value;
  var a = [];
  var i = 0;

  // start to do a check every 100ms.
  var interv = setInterval(function() {
      var rnd = Math.floor(Math.random() * text.length);
      if (text[rnd] === text[i]) {
        a.push(text[rnd]);
        i++;
      }

      // at the end of each call, see if a is long enough yet
      if(a.length > text.length){
        clearInterval(interv); // if so, stop this interval from running
        alert(a); // and do whatever you need to in the UI.
      }
    }, 100);
  }
}

Answer 2

所以，当你接触到异步编程时，你偶然发现了大多数人在某些时候遇到的陷阱。

你不能等待＆＃34;对于超时/间隔完成 - 尝试这样做将无法工作或阻止整个页面/浏览器。任何应该在延迟之后运行的代码都需要从您传递给setInterval的回调中调用，当它完成＆＃34;完成＆＃34;。

在我的回答中，它正是你想做的 - 通过随机混合初始，并使用setInterval创建完全相同的字符串。你没有写到你想要的结果，所以你把它写在控制台中，也写在另一个标识为output_string的输入字段中。

<强> HTML：

<input id="input_string" value="some_text" />
<input id="output_string" value="" readonly="readonly" />

<强> JavaScript的：

function checker() {
    var text = document.getElementById("input_string").value;
    var result = '';

    // split your input string to array
    text = text.split('');

    var int = setInterval((function() {
        var rnd = Math.floor(Math.random() * text.length);

        // add random character from input string (array) to the result
        result += text[rnd];

        // remove used element from the input array
        text.splice(rnd, 1);

        // if all characters were used
        if (text.length === 0) {
            clearInterval(int);

            console.log(result);

            document.getElementById("output_string").value = result;
        }
    }), 100);
}

checker();

DEMO

while循环和setInterval（）

2 个答案: