CODEWITHSUNDEEP
javascript
MDG
MDG

Reputation: 21

How can I display a Javascript output in real time?

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!

Upvotes: 2

Views: 906

Answers (2)

Neill Herbst
Neill Herbst

Reputation: 2122

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.

Upvotes: 1

Adarsh
Adarsh

Reputation: 46

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()

Upvotes: 1

Related Questions