javascript - getting the return data of a async function inside a function

Question

I am having a problem because chrome api functions are async and I cant get its return value. Consider the following code. I am using angularjs

    $scope.storageGet = function(param) {
        var returnData; 

        chrome.storage.local.get(param.storageName, function(data) {
            returnData = data;
        });

        return returnData;
    };

And when I tried to call it like this:

    console.log($scope.storageGet({'storageName': 'users'}));

It prints 'undefined' in the console. What I want to see is the obect of users stored in chrome storage. Well, I'm sure that I have data in chrome storage.

Answer 1

You cannot return data that is generated by an async function such as chrome.storage.local.get, because more likely your function will finish executing before the async function executes. This is why your function returns undefined, which is the default value of returnData.

A good alternative will be to make your function async as well by using a callback function.

$scope.storageGet = function(param, callback) {
    chrome.storage.local.get(param.storageName, function(data) {
        callback(data);
    });
};

Now you can call your function this way:

$scope.storageGet(param, function(returnData) {
    // do something with returnData
});