正在尝试使用数组方法来帮助显示消息

Question

我正在尝试将显示消息替换为，而不是显示"过低""正确"；，它将从数组函数中获取它来帮助显示我的消息。例如；你的猜测数字1是2，它太低了"你的猜测数字2是30，它太高了"；，类似的东西，但我不知道如何在RandomNumber((函数中实现数组函数。

function RandomNumber()
{
var guessed = document.getElementById("textbox").value;
var value4 = document.getElementById("guess").value;

count++; 

if (guessed==value4){
document.getElementById("correct").innerHTML +="correct<br/>"
}
else if(guessed>value4){
document.getElementById("correct").innerHTML +="wrong <br/>"
}
else if(guessed<value4){
document.getElementById("correct").innerHTML +="too low <br/>"
}
else if(guessed>value4){
document.getElementById("correct").innerHTML +="too high <br/>"
}
if(count===5) {
document.getElementById("correct").innerHTML +="max try <br/>"
document.getElementById("guessing").disabled=true;
}
}

这是我的数组函数，它保存我想要的输出显示

function getMessage(correctNumber, guess, guessNumber) 
{
const highOrLow = guess > correctNumber?"too high.":"too low.";
return `Your guess number ${guessNumber} is ${guess} and it is ${highOrLow}`;
}   

Answer 1

您可以创建一个对象来跟踪状态，尤其是尝试次数，因为它也必须存在于函数之外(但与一系列猜测有关(。

使用OOP稍微高级一点，也更可取，但这也很有效。还要注意，这个函数做两件事(创建一条消息并修改猜测对象，这是不受欢迎的(。最后，您的代码没有生成正确答案的消息，这可能会导致问题。

let guess = { correct: 5, guess: 2, attempt: 0 };
function getMessage(guess) 
{
const highOrLow = guess.guess > guess.correct?"too high.":"too low.";
return `Your guess number ${++guess.attempt} is ${guess.guess} and it is ${highOrLow}`;
}
console.log( guess );
console.log( getMessage( guess ) );
console.log( guess );
guess.guess = 10;
console.log( getMessage( guess ) );
console.log( guess );

Answer 2

我不确定这是否有帮助，但我认为您可以按如下方式进行调整，如果猜测值等于输入的值，则删除所有if-else语句，并使用main if语句打印更正。任何其他值都是不正确的，可以使用else语句处理。else语句调用getMessage函数，该函数验证该值是否大于或小于正确的值，并返回正确的答案。

let count = 0;
let value4;
let checkGuess = document.getElementById('checkGuess');
window.addEventListener('DOMContentLoaded', (event) => {
value4 = Math.floor((Math.random() * 100) + 1);
checkGuess.addEventListener('click', RandomNumber);
});
let RandomNumber = () => {
let guess = document.getElementById("textbox");
let correct = document.getElementById("correct");
//validate that the user entered a guess
if (!guess.value) {
alert('Please enter a guess');
return;
}
count++;
if (guess.value == value4) {
correct.innerHTML += "correct<br/>"
} else {
correct.innerHTML += `${getMessage(guess.value)}<br>`;
}
if (count > 4) {
correct.innerHTML += `max try, correct number is ${value4} <br/>`;
guess.disabled = true;
}
}
function getMessage(guess) {
const highOrLow = guess > value4 ? "too high." : "too low.";
return `Your guess number ${count} is ${guess} and it is ${highOrLow}`;
}

<input type="text" id="textbox" name="textbox">
<button type="button" id="checkGuess">Check my guess!</button>
<div id="correct"></div>