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

Question

请原谅我这个愚蠢的问题，但我是使用 Javascript 的初学者，我不确定这是因为我正在使用的 IDE(即 Replit)还是​​ Javascript 中有不同的规则(正如我所言)我对 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() 暂停(阻止)脚本的执行，这可能是您无法执行的原因在 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();

.as-console {background-color:black !important; color:lime;}
.as-console-wrapper {max-height:100% !important; top:0;}

您可以引用:Why does alert(); run before console.log();了解有关此问题的更多背景信息。但是，可以使用 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);

.as-console {background-color:black !important; color:lime;}
.as-console-wrapper {max-height:100% !important; top:0;}