Async/await - waiting for the return of data?

Question

I have a fetch method:

async fetch {
    return await axios.get('/api/users');
}

This is called:

let data = this.fetch();
console.log(data);

But the log is a promise - how can I get the log after the method call to log the data and not the promise, I thought async/await would wait for the promise to resolve?

I think the fetch "method" is missing some syntax. Also I think the async/await is unnecessary as it returns a promise. Consider using `let data = await this.fetch()`? — evolutionxbox, Feb 23 '21 at 11:05
An [async function](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function) always returns a promise. — Reyno, Feb 23 '21 at 11:13

Shuvo · Accepted Answer · 2021-02-23T11:10:56.367

1

async fetch {
    const res = await axios.get('/api/users');
    return await res.data;
}

edited Feb 23 '21 at 11:10

answered Feb 23 '21 at 11:04

Shuvo

1,253
9
18

2

I don't think axios returns a json method https://github.com/axios/axios#response-schema – evolutionxbox Feb 23 '21 at 11:06
@evolutionxbox, you are right. I have updated the code. Thank you for checking – Shuvo Feb 23 '21 at 11:07
This is near on what I have in my example... and still returns a promise – panthro Feb 23 '21 at 11:09
@panthro it will always return a promise. To get the result, either await the fetch call inside an async function, or use `.then`. – evolutionxbox Feb 23 '21 at 11:09
Ok, so I will need to console.log() inside the fetch or use then, that's the answer I'm looking for - thanks! – panthro Feb 23 '21 at 11:10
@panthro, you can add another `await` keyword in the last line. Please check the updated code – Shuvo Feb 23 '21 at 11:11
1

@panthro it doesn't need to be in the fetch, no. Try `console.log(await fetch())` or `fetch().then(x => console.log(x))` – evolutionxbox Feb 23 '21 at 11:12
1

An `async` function will always return a Promise, putting await after the `return` keyword won't change this. – Nick Parsons Feb 23 '21 at 11:13
1

You are right @NickParsons – Shuvo Feb 23 '21 at 11:16

score 0 · Answer 2 · answered Feb 23 '21 at 11:05

0

To read the data from a promise you must wait for it to finish executing. You can use the .then() function to log the data.


let data = this.fetch();

data.then(result => {
    console.log(result);
});

You can read further about promises here.

answered Feb 23 '21 at 11:05

Josh Hales

394
2
12

3

While this is correct, the OP is asking about `Async/await` in the title. – Rickard Elimää Feb 23 '21 at 11:06

Async/await - waiting for the return of data?

2 Answers2