3

I have the below code

function run(){
    one();
    two();
    three();
}

function one(){
    console.log(1);
}

function two(){
    setTimeout(function(){
        console.log(2);
    });
}

function three(){
    console.log(3);
}

run(); 

The Output of the following code will be 1,3,2

What are the changes we have to do in a code so that output will be 1,2,3 ?

2
  • 4
    Removing the setTimeout in two, since it's asynchronous? It's hard to know why you are asking that. Could you give more context? Commented Jul 4, 2020 at 18:19
  • indentation and linespacing is terrible, and styling is inconsistent... Commented Jul 4, 2020 at 18:28

4 Answers 4

3

This should work:

async function run() {
    await one();
    await two()
    await three()
}


function one() {
    Promise.resolve(
        console.log(1)
    )
}

function two() {
    return new Promise(resolve => {
        setTimeout(() => {
            console.log(2);
            resolve();
        });
    });


}

function three() {
    Promise.resolve(
        console.log(3)
    )
}

run(); 
Sign up to request clarification or add additional context in comments.

Comments

2

Realise that three is called immediately after two. If you want three to only be called once the setTimeout inside two expires, then you should call three in that setTimeout callback.

To achieve that, you can pass an argument to two:

function run() {
  one();
  two(three); // Tell "two" what to call when its timer expires
}

function one() {
  console.log(1);
}

function two(callback) { // <-- callback argument
  setTimeout(function() {
    console.log(2);
    callback(); // <---
  })
}

function three() {
  console.log(3);
}

run();

Promises

Once you start using setTimeout to chain several asynchronous pieces of code, you will soon get into what is a "callback hell".

So for completeness, here is an implementation using the modern async/await syntax for using promises:

// Generic helper function
const delay = ms => new Promise(resolve => setTimeout(resolve, ms));

async function run() {
  one();
  await two();
  three();
}

function one() {
  console.log(1);
}

async function two() {
  await delay(0); // So to have the timeout involved...
  console.log(2);
}

function three() {
  console.log(3);
}

run();

1 Comment

Nice! 87654321 - for comment length... :)
1

you can use promise

function run(){
one();
two().then(three)

}


function one(){
console.log(1);
}

function two(){
  return new Promise((resolve , reject) => {
    setTimeout(function(){
    console.log(2);
    resolve()
    })
  })

}



function three(){

console.log(3);
}

run();

4 Comments

I don't want to mark your answer as not useful, but introducing promises is complicating the issue.
@iAmOren On the contrary, promises are the standard measure to solve this problem, so any answer that does not mention them would be incomplete.
To clarify myself: "promises" can be an answer - hence, me not negatively marking your answer. That said, "standard" is subjective...
There should be one answer using await in conjunction with promises for this to be a complete q&a.
1
   function run() {
      one();
      two(); 
    }

    function one() {
      console.log(1);
    }

    function two() { 
      setTimeout(function() {
        console.log(2);
         three()
      })
    }

    function three() {
      console.log(3);
    }

    run();

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.