await doesn't wait for the function to end

Question

I'm new to javascript and I tried to implement my first async await and can't figure out where is my problem.

getName() - should return a promise after 1s. f() - should wait for getName to finish and then print name

What am I missing ?

const getName = async () => {
  setTimeout(() => 'xxx', 1000)
};

const f = async () => {
  name = await getName()
  console.log(name)
}

f()

Answer 1

Unless you're using await also inside getName, you don't need to have getName async, you just need to return a Promise; since await works with promises:

const getName = () => 
  new Promise(resolve => setTimeout(resolve, 1000, 'xxx'));

async f() {
  let name = await getName();
  console.log(name);
}

f();

Answer 2

To await a function, that function must return a promise.

You thus need to create a new promise. It will have 2 methods: resolve, and reject.

1. resolve returns the variable, and is used on success. You can catch its return value by using promise.then(value => ) or by awaiting it.
2. reject throws an error, and is used on error. You can catch the error by using promise.catch(err => ) or by awaiting the async function and wrapping it in a try-catch block.

Here is how your code should look:

const getName = async () => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('xxx');
    }, 1000)
  })
};

const f = async () => {
  name = await getName()
  console.log(name)
}

f()