The value of my function is undefined

问题:

I have this function wich will translate strings and phrases for other functions and should return an array with the translated parts. When I try to call the function in another function and captcher the returned value, I keep recieving the message that the returned value is undefined. When I don't let the translate function return a value but make her do an alert with the value she should return .. everything goes well.

So their is something I do what prevents the function translate() to return the value properly or what makes the function picklanguage() not recieve the returned value.

function translate(translateObject)
{
    var translations = new Array();

    dojo.xhrPost({
        url: 'http://'+window.location.hostname+'/translate/translate',
        content: { str: dojo.toJson(translateObject) },
        handleAs: "json",
        timeout: 2000,
        load: function(response){

            dojo.forEach(response.items, function(strg){
                  var key = strg.string;
                  translations[strg.string] = strg.translation;
                });

            return translations;
        },
        error: function(response){
                return 'Ben';
        }
    });
}

function pickLanguage()
{
    var language = translate({title: 'Kies hier je gewenste taal', dutch: 'Nederlands', french: 'French', german: 'Deutch', english: 'English'});

    errorDialog = new dijit.Dialog({
          content: dump(language),
          style: "width: 450px"
      });

    errorDialog.show();
}

回答1:

You misunderstood how dojo.xhrPost works, I think. It's async, so you'll need callbacks:

function translate(translateObject, callback)
{
    var translations = new Array();

    dojo.xhrPost({
        url: 'http://'+window.location.hostname+'/translate/translate',
        content: { str: dojo.toJson(translateObject) },
        handleAs: "json",
        timeout: 2000,
        load: function(response){

            dojo.forEach(response.items, function(strg){
                  var key = strg.string;
                  translations[strg.string] = strg.translation;
                });

            callback(translations);
        },
        error: function(response){
                callback('Ben');
        }
    });
}

function pickLanguage()
{
    translate({title: 'Kies hier je gewenste taal', dutch: 'Nederlands', french: 'French', german: 'Deutch', english: 'English'}, function(language) {
        errorDialog = new dijit.Dialog({
              content: dump(language),
              style: "width: 450px"
        });

        errorDialog.show();
    });
}

回答2:

You're using AJAX – asynchronous calls.

The load callback runs some time after your function finishes; you cannot return a value from it.

You need to return the value using a callback, the way xhrPost does.

回答3:

The translate function returns immediately.

It's an ajax request--it's handled asynchronously. The code in pickLanguage should be in the ajax callback, which is executed when the Ajax call returns.