在接受用户的答案之前，如何在控制台上显示我的问题？

Question

原谅我这个愚蠢的问题，但是我是使用Javascript的初学者，我不确定这是因为我正在使用的IDE（是Replit）还是​​Javascript中有其他规则（因为我'对C＃有点熟悉，如果我使用C＃就不会遇到这个问题。

但是，在接受用户输入之前，我不知道如何在窗口中显示输入。例如，我有以下代码，这是我在问琐事问题的小游戏中的一部分。

class Question {
  constructor(t, oA, oB, oC, oD, ans) {
    this.title = t;
    this.optionA = oA;
    this.optionB = oB;
    this.optionC = oC;
    this.optionD = oD
    this.answer = ans;
  }

  displayEntireQuestion() {
    console.log(`${this.title}`);
    console.log(`A.${this.optionA}`);
    console.log(`B.${this.optionB}`);
    console.log(`C.${this.optionC}`);
    console.log(`D.${this.optionD}`);
  }
}

let Round1Questions = [
    new Question("What was the most popular language of 2018?", "PHP", "JavaScript", "Ruby", "Python", "Javascript"),
  new Question("What year did WW2 end in?", "1945",
    "1939", "1978", "1942", "1945")
]

let question1 = Round1Questions[Math.floor(Math.random() * Round1Questions.length)];



question1.displayEntireQuestion();

console.log("Please enter the correct answer");

userAnswer = prompt();

if (userAnswer == question1.answer) {
  console.log("Correct!");
} else {
  console.log("Sorry, wrong answer.");
}

运行此命令时，它将自动转到提示命令，而无需先显示问题。我怎样才能解决这个问题？我问这个问题真是愚蠢，因为我习惯在Visual Studio中使用C＃，其中的代码逐行执行。

编辑：即使我在提示方法中输入了“请输入正确答案”，它仍然不能解决未首先显示该问题的问题

Answer 1

我相信您的问题是alert()和prompt()暂停（阻止）脚本的执行，这可能是导致您在{之前无法在控制台上看到日志的原因{1}}。您可以在下一个示例中检查它是否不起作用（您提到的问题）：

prompt()

class Question
{
    constructor(t,oA,oB,oC,oD,ans)
    {
        this.title=t;
        this.optionA=oA;
        this.optionB=oB;
        this.optionC=oC;
        this.optionD=oD
        this.answer=ans;
    }

    displayEntireQuestion()
    {
        console.log(`${this.title}`);
        console.log(`A.${this.optionA}`);
        console.log(`B.${this.optionB}`);
        console.log(`C.${this.optionC}`);
        console.log(`D.${this.optionD}`);
    }
}

let Round1Questions = [];
Round1Questions.push(new Question("What was the most popular language of 2018?","PHP","JavaScript","Ruby", "Python", "Javascript"));
Round1Questions.push(new Question("What year did WW2 end in?", "1945", "1939", "1978", "1942", "1945"));

let question1 = Round1Questions[Math.floor(Math.random()*Round1Questions.length)];
question1.displayEntireQuestion();
let userAnswer = prompt();

您可以参考：Why does alert(); run before console.log();，以获取有关此问题的更多背景信息。但是，可以使用.as-console {background-color:black !important; color:lime;} .as-console-wrapper {max-height:100% !important; top:0;}实现对此的简单修复：

setTimeout()

class Question
{
    constructor(t,oA,oB,oC,oD,ans)
    {
        this.title=t;
        this.optionA=oA;
        this.optionB=oB;
        this.optionC=oC;
        this.optionD=oD
        this.answer=ans;
    }

    displayEntireQuestion()
    {
        console.log(`${this.title}`);
        console.log(`A.${this.optionA}`);
        console.log(`B.${this.optionB}`);
        console.log(`C.${this.optionC}`);
        console.log(`D.${this.optionD}`);
    }
}

let Round1Questions = [];
Round1Questions.push(new Question("What was the most popular language of 2018?","PHP","JavaScript","Ruby", "Python", "Javascript"));
Round1Questions.push(new Question("What year did WW2 end in?", "1945", "1939", "1978", "1942", "1945"));

let question1 = Round1Questions[Math.floor(Math.random()*Round1Questions.length)];
question1.displayEntireQuestion();
let userAnswer = setTimeout(() => prompt());

但是我建议使用.as-console {background-color:black !important; color:lime;} .as-console-wrapper {max-height:100% !important; top:0;}显示您的问题，如下所示：

prompt()

class Question
{
    constructor(t,oA,oB,oC,oD,ans)
    {
        this.title=t;
        this.optionA=oA;
        this.optionB=oB;
        this.optionC=oC;
        this.optionD=oD
        this.answer=ans;
    }

    displayEntireQuestion()
    {
        return prompt(`${this.title}\nA.${this.optionA}\nB.${this.optionB}\nC.${this.optionC}\nD.${this.optionD}`);
    }
}

let Round1Questions = [];
Round1Questions.push(new Question("What was the most popular language of 2018?","PHP","JavaScript","Ruby", "Python", "Javascript"));
Round1Questions.push(new Question("What year did WW2 end in?", "1945", "1939", "1978", "1942", "1945"));

let question1 = Round1Questions[Math.floor(Math.random()*Round1Questions.length)];
let userAnswer = question1.displayEntireQuestion();
console.log(userAnswer);

Answer 2

prompt函数需要输入一个字符串来显示-像这样使用：

var userAnswer = prompt("Please enter the correct answer");
console.log(userAnswer);

如果要单独显示，请先使用alert，然后使用prompt：

alert("Please enter the correct answer");
var userAnswer = prompt();
console.log(userAnswer);

Answer 3

UI警报（例如alert，prompt和confirm）阻止正在执行的线程的操作（JavaScript中只有一个）。我需要研究细节，但我怀疑控制台消息的显示不是即时的，并且可能仅在每个事件循环/异步发生一次。

您的解决方案是即使在最短的时间内也可以延迟提示。

setTimeout(() => {
  let userAnswer = prompt("Please enter the correct answer");

  if (userAnswer == question1.answer) {
    console.log("Correct!");
  } else {
    console.log("Sorry, wrong answer.");
  }
})

但是，实际上，请不要使用开发者控制台来显示关键应用程序信息。我也建议使用事件触发prompt()。

Answer 4

为什么不只将要显示的字符串传递给用户prompt？例如：

userAnswer = prompt("Please enter the correct answer");