assign function return value to some variable using javascript

Question

I have a js function , after doing some business logic, the javascript function should return some result to another variable.Sample code below

var response="";
function doSomething() {  
    $.ajax({
        url:'action.php',
        type: "POST",
        data: dataString,
        success: function (txtBack) { 
            if(txtBack==1) {
                status=1;
            }
    });
    return status;     
}

Here i want to use like

response=doSomething();

I want to assign a return value "status" "var response".But the result is 'undefined'.

Already got the correct wording in your title: *return value*. But you are not using `return` in your function ;) — Felix Kling, Oct 15 '10 at 10:33
Note that usually you don't need to initialize new variables with values if those values are falsy (which an empty string is). You can just write: var response; The value of response will be set to the undefined value in this case (which is also a falsy value). Then later, when you want to check if the value has been set, you can just check if it is falsy or not... — Šime Vidas, Oct 15 '10 at 10:45
@Felix: i have a ajax call inside the function, it is returning "undefined". any idea? Thanks — Ra., Oct 15 '10 at 11:14
Search here on SO about this issue. This is normal. You cannot return a value form an Ajax call, because it is executed asynchronously, i.e. the `return` statement is executed *before* the Ajax call finished. You can solve this using callbacks... — Felix Kling, Oct 15 '10 at 11:21
@Felix: Hi, i made a little change in the code, after success condition, i just include "async :false".... now the code is working fine as expected :) — Ra., Oct 19 '10 at 07:55
@Ra: But keep in mind that `async: false` is bad. Depending on how long the Ajax call takes, it can freeze the browser. And you loose imho the most important feature of an Ajax call. — Felix Kling, Oct 19 '10 at 08:00

score 82 · Answer 1 · answered Oct 15 '10 at 10:34

82

Or just...

var response = (function() {
    var a;
    // calculate a
    return a;
})();

In this case, the response variable receives the return value of the function. The function executes immediately.

You can use this construct if you want to populate a variable with a value that needs to be calculated. Note that all calculation happens inside the anonymous function, so you don't pollute the global namespace.

answered Oct 15 '10 at 10:34

Šime Vidas

182,163
62
281
385

4

For the curious, this is called an *immediately invoked function express* (IIFE). And it is awesome. – Scribblemacher Jun 16 '17 at 15:33
6

Note that the function itself is inside parenthesis (there is an opening parenthesis before the word `function`) and that there is an extra `()` at the end. (It was not obvious to me at first sight) – J0ANMM Jun 16 '17 at 16:27
How do I pass parameters using this syntax? – Leonard Niehaus Aug 30 '19 at 22:42
@LeonardNiehaus `(function(w) { /*…*/ })(window)` – Šime Vidas Aug 31 '19 at 13:05

score 21 · Answer 2 · edited Sep 28 '17 at 04:00

AJAX requests are asynchronous. Your doSomething function is being exectued, the AJAX request is being made but it happens asynchronously; so the remainder of doSomething is executed and the value of status is undefined when it is returned.

Effectively, your code works as follows:

function doSomething(someargums) {
     return status;
}

var response = doSomething();

And then some time later, your AJAX request is completing; but it's already too late

You need to alter your code, and populate the "response" variable in the "success" callback of your AJAX request. You're going to have to delay using the response until the AJAX call has completed.

Where you previously may have had

var response = doSomething();

alert(response);

You should do:

function doSomething() {  
    $.ajax({
           url:'action.php',
           type: "POST",
           data: dataString,
           success: function (txtBack) { 
            alert(txtBack);
           })
    }); 
};

score 9 · Answer 3 · answered Oct 15 '10 at 10:28

9

You could simply return a value from the function:

var response = 0;

function doSomething() {
    // some code
    return 10;
}
response = doSomething();

answered Oct 15 '10 at 10:28

Darin Dimitrov

1,023,142
271
3,287
2,928

Its working... but i have ajax call inside, in thats time the result is 'undefined'. Any idea? Please look at the modified sample code. – Ra. Oct 15 '10 at 11:12

score 2 · Answer 4 · answered Mar 20 '17 at 15:44

The only way to retrieve the correct value in your context is to run $.ajax() function synchronously (what actually contradicts to main AJAX idea). There is the special configuration attribute async you should set to false. In that case the main scope which actually contains $.ajax() function call is paused until the synchronous function is done, so, the return is called only after $.ajax().

function doSomething() {
    var status = 0;
    $.ajax({
        url: 'action.php',
        type: 'POST',
        data: dataString,
        async: false,
        success: function (txtBack) {
            if (txtBack == 1)
                status = 1;
        }
    });

    return status;
}

var response = doSomething();

Aley · Answer 5 · 2019-08-15T12:26:52.800

The result is undefined since $.ajax runs an asynchronous operation. Meaning that return status gets executed before the $.ajax operation finishes with the request.

You may use Promise to have a syntax which feels synchronous.

function doSomething() { 
    return new Promise((resolve, reject) => {
        $.ajax({
            url:'action.php',
            type: "POST",
            data: dataString,
            success: function (txtBack) { 
                if(txtBack==1) {
                    resolve(1);
                } else {
                    resolve(0);
                }
            },
            error: function (jqXHR, textStatus, errorThrown) {
                reject(textStatus);
            }
        });
    });
}

You can call the promise like this

doSomething.then(function (result) {
    console.log(result);
}).catch(function (error) {
    console.error(error);
});

or this

(async () => {
    try {
        let result = await doSomething();
        console.log(result);
    } catch (error) {
        console.error(error);
    }
})();

assign function return value to some variable using javascript

5 Answers5

Linked