为什么这段代码有时会崩溃浏览器？

Question

任何人都可以向我解释为什么这段代码有时会进入无限循环（大概来自while循环）并崩溃浏览器窗口？ 是否与while(userChoice != randNumber) ，这是否有足够的结束？

var check = function(userChoice) {
        while ((isNaN(userChoice)) || (userChoice > 100) || (userChoice < 1) || (userChoice %1 !== 0)) {
        userChoice = prompt("Choose a number between 1 - 100", "It must be a whole number!");
    }
};

var randNumber = Math.floor(Math.random() * 100 + 1);
var userChoice = prompt("Choose a number between 1 - 100");
console.log(userChoice);
check(userChoice);
//Above sorts out the computer choice and sets the rules for the user choice

while(userChoice != randNumber) {
    if (userChoice > randNumber) {
        userChoice = prompt("Your number is GREATER than the computer.", "Please re-choose a number between 1 - 100");
        check(userChoice);
    }
    else if (userChoice < randNumber) {
        userChoice = prompt("Your number is SMALLER than the computer.", "Please re-choose a number between 1 - 100");
        check(userChoice);
    }
}    

console.log("Your number matches! Congratulations!");

这是对我之前的一些代码的修改，这些代码会更频繁地崩溃。 虽然上面的代码更稳定，但它偶尔会崩溃，虽然我无法解释启动infinte循环的确切过程。

旧代码如下:( 作为优先级可以有人告诉我为什么会崩溃？我不明白为什么while循环没有在达到正确的数字时结束！）

main = function() {


var randNumber = Math.floor(Math.random() * 100 + 1);
var userChoice = prompt("Choose a number between 1 - 100");
while ((isNaN(userChoice)) || (userChoice > 100) || (userChoice < 1) || (userChoice %1 !== 0)) {
    userChoice = prompt("Choose a number between 1 - 100", "It must be a whole number!");
}
//Above sorts out the computer choice and sets the rules for the user choice

while(userChoice !== randNumber) {
    if (userChoice > randNumber) {
        userChoice = prompt("Your number is GREATER than the computer.", "Please re-choose a number between 1 - 100");
    }
    else if (userChoice < randNumber) {
        userChoice = prompt("Your number is SMALLER than the computer.", "Please re-choose a number between 1 - 100");
    }
}    

return("Your number matches! Congratulations!");

};
main();

Answer 1

“旧代码”的问题是你正在使用“Strict Equality Comparison” !==在while条件下将无法满足，除非你将userChoice转换为数字，因为提示返回一个字符串值。 如果你使用!=它会工作。

“新代码”的问题与闭包有关，在check函数中创建了一个新的局部变量userChoice ，因为你传递的是一个参数，这意味着userChoice的userChoice与你在外面声明的userChoice ，你可以删除参数并使用您定义的全局变量：

var check = function() {...}
... 
var userChoice = prompt("Choose a number between 1 - 100");
check();

Answer 2

我想我已经设法找到代码进入无限循环的原因：

第一：

var check = function(userChoice) { .... };

在这个功能中，你正在做

userChoice = prompt("[...]");

此userChoice引用该函数的参数userChoice 。 因此，它无法更改您在下面定义的全局userChoice ，因为它是一个不同的肠道变量。

其次，您声明您的全局userChoice ：

var userChoice = prompt("Choose a number between 1 - 100");

这将在全局范围中创建一个变量userChoice ，并分配用户在提示中输入的内容。 它可能是一个字符串！

然后，执行函数检查： check(userChoice);

您将全局userChoice作为参数传递，但在您的函数中， userChoice引用本地userChoice而不是全局userChoice 。

输入不大于100且小于1的整数值后，while退出...

此时，全局userChoice仍然是您首先输入的值，因为您操纵了另一个变量（本地变量）。

然后，使用您在第一个位置输入的值执行下一个while。 如果此值不满足userChoice !== randNumber ，则进入循环; 检查userChoice > randNumber或userChoice < randNumber 。

如果输入了字符串，则这三个检查失败。 因此，创建一个无限循环。

tl; dr - 如何解决这个问题

删除检查函数的参数，这样就不会创建局部变量：

function check() {
    while ((isNaN(userChoice)) || (userChoice > 100) || (userChoice < 1) || (userChoice %1 !== 0)) {
        userChoice = prompt("Choose a number between 1 - 100", "It must be a whole number!");
    }
};

Answer 3

你的问题是：

while(userChoice !== randNumber) {

userChoice的结果（ prompt的结果）是一个字符串， randNumber是一个数字。

因此，如果randNumber为1且用户输入1则结果仍为字符串。
所以比较是1 !== "1"这是true 。

因此，你将永远拥有无限循环。 （一个数字总是!==到一个字符串）。

您可以将其更改为：

while(userChoice != randNumber) {

Answer 4

条件

(userChoice !== randNumber)

永远不会是假的，因为“！==”的意思是“不同但相同的类型”并且提示返回一个字符串，而不是一个数字！ 所以，一旦你猜对了这个数字，循环永远不会结束。 一旦找到答案，它就会崩溃，因为在此之前，提示会减慢循环速度。

放

while(userChoice != randNumber)

你会没事的:)

看看这个稍微更现代的版本： http ： //jsfiddle.net/e6gYJ/13/

Answer 5

我相信这是你的使用！== vs.！=

当您使用！==时，您明确匹配类型AND值。

所以

5 !== "5"; //will be true
5 !== 5; //will be false

而

5 != '5'; // will be false