Question

I would like to call a function within a function and have this inner function return an object. I am using a JSONRequest function that I created myself so just assume that the request fetches an array of roles. Here is the code:

(users = function(){

    this.getUserRoles = function(){

        var params = {};

        var json = new JSONRequest(function(data){

            rolesObj = data['roles'];

            return rolesObj;

        }, 'get_roles', params);

    }

});

Then I call the following but it returns undefined:

var cls = new users();

alert(cls.getUserRoles().length);

Answer 1

ajax requests are asynchronous so you’re not going to get a return value from them. You do, however, receive a callback when they complete so you can pass your “return” value into a callback.

Here is an example of your code re-written to use a callback:

this.getUserRoles = function(completionCallback){

    var params = {};

    var json = new JSONRequest(function(data){

        rolesObj = data['roles'];

        completionCallback(rolesObj);
        return rolesObj;

    }, 'get_roles', params);

}

and then using it:

var cls = new users();
cls.getUserRoles(function(roles) {
    alert(roles.length);
});

The rolesObj is passed into the callback function once the JSON request completes.