Edit - Stack Overflow

You are not logged in. Your edit will be placed in a queue until it is peer reviewed.

We welcome edits that make the post easier to understand and more valuable for readers. Because community members review edits, please try to make the post substantially better than how you found it, for example, by fixing grammar or adding additional resources and hyperlinks.

Required fields*

Rev

Required fields*

How do I return the response from an asynchronous call?

How do I return the response/result from a function foo that makes an asynchronous request?

I am trying to return the value from the callback, as well as assigning the result to a local variable inside the function and returning that one, but none of those ways actually return the response — they all return undefined or whatever the initial value of the variable result is.

Example of an asynchronous function that accepts a callback (using jQuery's ajax function):

function foo() {
 var result;
 $.ajax({
 url: '...',
 success: function(response) {
 result = response;
 // return response; // <- I tried that one as well
 }
 });
 return result; // It always returns `undefined`
}

Example using Node.js:

function foo() {
 var result;
 fs.readFile("path/to/file", function(err, data) {
 result = data;
 // return data; // <- I tried that one as well
 });
 return result; // It always returns `undefined`
}

Example using the then block of a promise:

function foo() {
 var result;
 fetch(url).then(function(response) {
 result = response;
 // return response; // <- I tried that one as well
 });
 return result; // It always returns `undefined`
}

Answer*

Angular 1
--------

People who are using [AngularJS][1], can handle this situation using *promises*.

[Here][2] it says,

> Promises can be used to unnest asynchronous functions and allows one to chain multiple functions together.

You can find a nice explanation [here][3] also.

An example found in [documentation][4] mentioned below.

 promiseB = promiseA.then(
 function onSuccess(result) {
 return result + 1;
 }
 ,function onError(err) {
 // Handle error
 }
 );

 // promiseB will be resolved immediately after promiseA is resolved
 // and its value will be the result of promiseA incremented by 1.

Angular 2 and later
------------------

In Angular 2 with look at the following example, but its [recommended][5] to use *observables* with Angular 2.

 search(term: string) {
 return this.http
 .get(`https://api.spotify.com/v1/search?q=${term}&type=artist`)
 .map((response) => response.json())
 .toPromise();
 }

You can consume that in this way,

 search() {
 this.searchService.search(this.searchField.value)
 .then((result) => {
 this.result = result.artists.items;
 })
 .catch((error) => console.error(error));
 }

See the [original][6] post here. But TypeScript does not support [native ES6 Promises][7], if you want to use it, you might need plugin for that.

Additionally, here is the [promises specification][8].

 [1]: http://en.wikipedia.org/wiki/AngularJS
 [2]: http://liamkaufman.com/blog/2013/09/09/using-angularjs-promises/
 [3]: http://andyshora.com/promises-angularjs-explained-as-cartoon.html
 [4]: https://docs.angularjs.org/api/ng/service/$q
 [5]: https://angular-2-training-book.rangle.io/handout/observables/observables_vs_promises.html
 [6]: https://angular-2-training-book.rangle.io/handout/http/requests_as_promises.html
 [7]: http://www.datchley.name/es6-promises/
 [8]: https://github.com/promises-aplus/promises-spec

Draft saved

Draft discarded

Edit Summary*

Cancel

20

This does not explain how promises would solve this issue at all though.

Benjamin Gruenbaum
– Benjamin Gruenbaum

2014年11月04日 02:29:10 +00:00
Commented Nov 4, 2014 at 2:29
9

jQuery and fetch methods both return promises as well. I would suggest revising your answer. Though jQuery's isn't quite the same (then is there, but catch isn't).

Tracker1
– Tracker1

2015年02月19日 19:24:49 +00:00
Commented Feb 19, 2015 at 19:24

Add a comment |

How to Edit

Correct minor typos or mistakes
Clarify meaning without changing it
Add related resources or links
Always respect the author’s intent
Don’t use edits to reply to the author

How to Format

create code fences with backticks ` or tildes ~
```
like so
```
add language identifier to highlight code
```python
def function(foo):
print(foo)
```
put returns between paragraphs
for linebreak add 2 spaces at end
_italic_ or **bold**
indent code by 4 spaces
backtick escapes `like _so_`
quote by placing > at start of line
to make links (use https whenever possible)

<https://example.com>

[example](https://example.com)

<a href="https://example.com">example</a>

formatting help »
answering help »

How to Tag

A tag is a keyword or label that categorizes your question with other, similar questions. Choose one or more (up to 5) tags that will help answerers to find and interpret your question.

complete the sentence: my question is about...
use tags that describe things or concepts that are essential, not incidental to your question
favor using existing popular tags
read the descriptions that appear below the tag

If your question is primarily about a topic for which you can't find a tag:

combine multiple words into single-words with hyphens (e.g. python-3.x), up to a maximum of 35 characters
creating new tags is a privilege; if you can't yet create a tag you need, then post this question without it, then ask the community to create it for you

popular tags »

lang-js

CollectivesTM on Stack Overflow

How do I return the response from an asynchronous call?

Answer*