如何实时显示 Javascript 输出？

Question

Apologies if this is a simple question, but is there a way to output Javascript to the console in real-time, while pausing at each user interaction. In other words, if I did something as simple as...

 console.log("What's your name: "); let userName = prompt("What is your name?"); console.log(userName); console.log("\\n"); console.log("Nice to meet you " + userName + "! What is your age?"); let userAge = prompt("What is your age?"); console.log(userAge);

...can I get the name outputted to the screen before the age prompt comes up? This is doable in other teaching environments (MS Basic & the command prompt), but either doesn't exist in Javascript, or I'm missing something.

Thanks for helping the newb!

Answer 1

You can make use of setTimeout, something like this:

console.log("What's your name: ");
let userName = prompt("What is your name?");
console.log(userName);

console.log("\n");
setTimeout(function(){
console.log("Nice to meet you " + userName + "! What is your age?");
let userAge = prompt("What is your age?");
console.log(userAge);
},1000)

Note: This is one way to do it there are ample of other ways to do it.

In case if you want to use promises:

let userName,userAge, userSport;
function basic(){
console.log("What's your name: ");
var promise1 = new Promise(function(resolve, reject){
userName = prompt("What is your name?");
resolve(userName)
})
promise1.then(function(value){
console.log(value);
console.log("\n");
console.log("Nice to meet you " + value + "! What is your age?");
var promise2 =  new Promise(function(resolve, reject){
userAge = prompt("What is your age?");
resolve(userAge)
})
promise2.then(function(value){
console.log(value)
console.log("Nice to meet you " + userName + " aged: " +userAge + ". Let us know your favorite sports")

var promise3 = new Promise(function(resolve, reject){
userSport = prompt("What is your favorite sports?");
resolve(userSport)
})
promise3.then(function(value){
console.log(value)
console.log("Nice to meet you " + userName + " aged:  " +userAge + " and your favorite sports is " +value)
console.log("\n");
console.log("Thanks");
})
})
})

}
basic()

Answer 2

You can use the async/await functionality and promises. I personally do not always like to use .then so this is my version of using Promises.

 const Q1 = () => new Promise(resolve => { let userName = prompt('What is your name?'); console.log(`What is your name: ${userName}`); resolve(userName); }) const Q2 = (userName) => new Promise(resolve => { console.log(`Nice to meet you ${userName}! What is your age?`); let age = prompt('What is your age?'); console.log(age); resolve(age); }) const userPrompt = async () => { let name = await Q1(); let age = await Q2(name); // assigned to variable should you want to use it in next question } userPrompt();

You can now just add additional questions as functions.

Also here is a link to a JSFiddle . If you run it and open the console you will see that the name is displayed before the age prompt is opened.