在while循环中的Javascript if语句

时间:2017-02-20 07:11:01

标签: javascript if-statement while-loop increment

下面你可以找到创建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>

5 个答案:

答案 0 :(得分:4)

当你将增量放在if条件之外时,如果while数组中已经存在一个数字,那么它就不会进入if条件,因此div永远不会填满。但是,您继续前进到下一个div,因为您增加了numbers值。如果将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 :(得分:1)

  • 因为在第一个示例中,只有在生成了唯一随机数的情况下才会提前componentDidMount
  • 在第二个示例中,无论生成的数字是否唯一,您都会前进x。所以在这种情况下可能会发生这种情况,在它尝试的8次中(因为那是你的x条件),它只生成了两个唯一的随机数,例如。

答案 2 :(得分:0)

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

答案 3 :(得分:0)

在外面递增,如果块将在没有任何条件的情况下执行。

但是你在内部递增,如果阻止只在该条件为真时执行。

答案 4 :(得分:0)

如果已经采用了数字,您可以使用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>