在while循环中的Javascript if语句

Question

您可以在下面找到用于创建1到80之间的随机8个数字的代码。它将随机数放入数字数组并写入div。 如果代码在括号内增加x，则代码运行没有任何问题。 如果我把'x ++'放在if括号之外，经过几次运行后我发现有时它会创建一个相同的随机数并在数字数组中找到。 然后它跳过并且div变空了。

在if块中递增x和在块外递增x之间有什么区别？

在if块内：

var numbers = []
var luckyNumber;
var x = 1;

while (x <= 8) {
  luckyNumber = Math.floor(Math.random() * 80 + 1);
  if (numbers.indexOf(luckyNumber) == -1) {
    document.getElementById('k' + x).innerHTML = luckyNumber;
    numbers.push(luckyNumber);
    x++;
  }
}

在if块之外：

var numbers = []
var luckyNumber;
var x = 1;

while (x <= 8) {
  luckyNumber = Math.floor(Math.random() * 80 + 1);
  if (numbers.indexOf(luckyNumber) == -1) {
    document.getElementById('k' + x).innerHTML = luckyNumber;
    numbers.push(luckyNumber);
  }
  x++;
}

HTML：

<div id="k1">K1</div>
<div id="k2">K2</div>
<div id="k3">K3</div>
<div id="k4">K4</div>
<div id="k5">K5</div>
<div id="k6">K6</div>
<div id="k7">K7</div>
<div id="k8">K8</div>

Answer 1

当你把增量放在if条件之外时，如果numbers数组中已经存在一个numbers ，那么它就不会进入if条件，因此div永远不会填满。 但是，您继续前进到下一个div，因为您增加了x值。 如果你把x递增外，在x值保持不变，当条件内if没有得到满足，因此，在未来反复的条件可以传递或它的继续努力。

执行流程

当你在里面增加时

1) Generate random number.
2) Check in is already generated, if yes skip it. // you see ? when skip no increment happens, because the increment inside the the condition.
3) Generate again and go to step 2.

当你在外面增加时

1) Generate random number.
2) Check in is already generated, if yes skip it. Increase x value to next. //** you see ? incrementing no matter you skip it or not.
3) Generate again and go to step 2.

Answer 2

• 因为在第一个示例中，仅在已生成唯一随机数的情况下才前进x 。
• 在第二个示例中，无论生成的数字是否唯一，都会前进x 。 因此，它可能发生在这种情况下，出了8倍它试图（因为那是你的while条件），它产生的只是两个独特的随机数，例如。

Answer 3

如果你把x ++写在外面，如果它总是增加1 ..如果你把它放在里面，如果它清楚它会在你的条件满足时增加..根据这个，你的输出可能会有所不同。

Answer 4

如果 block将在没有任何条件的情况下执行， 则在外部递增

但是你在内部递增， 如果块只在该条件下执行才是真的。

Answer 5

如果已经采用了数字，你可以使用do while循环进行检查。

 var numbers = [], luckyNumber, x = 1; while (x <= 8) { do { luckyNumber = Math.floor(Math.random() * 80 + 1); } while (numbers.indexOf(luckyNumber) !== -1) document.getElementById('k' + x).innerHTML = luckyNumber; numbers.push(luckyNumber); x++; } 

 <div id="k1">K1</div> <div id="k2">K2</div> <div id="k3">K3</div> <div id="k4">K4</div> <div id="k5">K5</div> <div id="k6">K6</div> <div id="k7">K7</div> <div id="k8">K8</div>