How to return an Ajax result using async/await?

Question

Trying to get familiar with async/await, I've tried the following code in Chrome:

async function f() { 
     return await $.get('/');
};
var result = f();

but result doesn't hold the result (string); rather it holds a Promise which needs to be awaited again. This code does give me the response string:

var response = await $.get('/');

How can I return the actual response string from a function using await?

async/await doesn't magically solve the return from asynchronous function problem. Somewhere, you'll still have to wait on the result. In this case, you need a `.then()` on `result`. — Kevin B, Jan 29 '18 at 17:06

messerbill · Accepted Answer · 2018-01-29T17:11:05.703

29

either

function f() { 
  return $.get('/');
};

async test() {
  var x = await f()
  console.log(x)
}

test()

or

f().then(function(res) {
    console.log(res)
}

the async/await is just another way to write the same logic.

edited Jan 29 '18 at 17:11

answered Jan 29 '18 at 17:09

messerbill

5,142
1
23
35

so what does the extra await I put in f() does? – user3599803 Jan 29 '18 at 17:09
@user3599803 what do you mean? – messerbill Jan 29 '18 at 17:12
in my code above, I wrote `return await $.get('/');` inside `f()`, is this await is useless? – user3599803 Jan 29 '18 at 17:14
1

yes, this await has no effect when you call the `f()` method. If you'd like to write further code lines inside of `f()` your await would make sense: `f() { let res = await $.get('/'); console.log(res) };` – messerbill Jan 29 '18 at 17:16

samanime · Answer 2 · 2018-01-29T17:16:37.127

await and async are basically just syntactical sugar on top of Promise. If you end up with a Promise at the end, you still need to treat it like a Promise.

const response = f().then(() => { });

Or, if you are calling it inside of an async function, you can await to resolve it:

async function main() {
  const response = await f();
  console.log(response);
}

A pattern I like to use is have my main code wrapped in a self-executing async function, so I can still use await:

(async () => {
  const result = await doSomething();
  console.log(result);
})();

Note that even with that pattern, I need a final catch() to catch any errors it may have that aren't caught otherwise:

(async () => {
  // blah blah
})().catch(() => {});

score -1 · Answer 3 · answered Aug 23 '21 at 10:40

-1

The return type of async functions is Promise. So you will have to await or then() to get the result.

answered Aug 23 '21 at 10:40

noob_coder

23
1
6

How to return an Ajax result using async/await?

3 Answers3

Linked

Related