CODEWITHSUNDEEP
javascriptsyntax
toy
toy

Reputation: 12141

What does two returns in javascript means?

I was reading a blog post about promises and I found this code which I'm not sure how this works? 

function getPost(id) {
    return $.getJSON('/posts/'+ id).then(function(data, status, xhr) {
        return data;
    });
}

when I tried this function it will always return me a promise which is the default for $.getJSON but what does the second return data; mean?

Thanks

Upvotes: 2

Views: 95

Answers (5)

valverij
valverij

Reputation: 4941

That second return belongs to the anonymous callback method defined for the .then() method. If you change the formatting to something less standardized, it will be easier to visualize:

function getPost(id) {
    return $.getJSON('/posts/'+ id).then(
        function(data, status, xhr) {
            return data;
        }
    );
}

If you nix the anonymous function altogether, then it would look something like this:

function jsonCallback(data, status, xhr) {
    return data;
}

function getPost(id) {
    return $.getJSON('/posts/'+ id).then(jsonCallback);    
}

Typically, something like this would just be set up as it is in your question, but separating them can make it easier to see for beginners.

Basically, we can assume that the .then() method takes in another function as a parameter (the anonymous method/jsonCallback above). Within that, it probably has (or at least calls) some code that looks something like this:

function then(callback) {
    if(callback && typeof(callback) === typeof(Function) {
        callback(data, status, xhr); // data, status, and xhr are probably defined eslewhere in the object
    }
}

That's definitely an overly simplistic example of jQuery's deferred.then() method, but you get the idea.

Upvotes: 5

Tony
Tony

Reputation: 4609

SO if you look at the $.getJSON('/posts/' + id) you will find that the object returned has a method called then in it and within that function is the following code

function (a,b,c){i.done(a).fail(b).progress(c);return this}

So when calling that then method it is saying if the call to this getJSON method succeeds in what it returns then lets go ahead and run this function. that is the i.done(a) part of the then method. So for example lets say you ran 

$.getJSON('/apicall').then(function () {alert ("Success");})

When ran that would alert to the browser success and just the same if you were to run

$.getJSON('/apicall').then(function () {alert ("Success");}).done(function() {alert("DONE");})

You would then get alerted Success then get alerted Done because the api call is done. Also if you look into the $.getJSON call you will find that the following is in that method

function (a,b,c){return f.get(a,b,c,"json")}

So if you ran right now in the console

$.get('/asdf').then(function () { alert("Success");}).done(function () { alert("Done");})

You would be able to see what I mean. As far as the return data statement that is saying return the data json data that was retrieved. However it is not returning it anywhere which is strange. So if you were to make a call to getPost it would not return anything at that point.

Upvotes: 0

FishBasketGordo
FishBasketGordo

Reputation: 23142

The statement return data; is part of the function literal that is passed to the then method. It's not executed immediately.

Here's the timeline:

  1. getPost returns the result of the chain of methods $.getJSON and then, which is a Promise object.
  2. When the AJAX call initiated by $.getJSON is completed, the function passed to then gets called. This function is known as a callback.
  3. Finally, the callback function executes, and that's when return data; actually runs.

Upvotes: 2

Sterling Archer
Sterling Archer

Reputation: 22395

Look closer at the scope of the return statements. One returns callback data from the anonymous function, which returns all that data for the function

Upvotes: 0

helion3
helion3

Reputation: 37381

The getPost method returns the returned result of getJSON, and the closure passed to then returns the data.

Upvotes: 0

Related Questions