Javascript Scoping, Inline functions, and asynchronous operations

Question

I'm working on a geoprocessing web application. My application will provide users with a specific set of options, the user will provide some data, and then I will process the data on the server and finally return the results. If it matters, I am using the CMV http://docs.cmv.io/en/1.3.3/ as a framework and trying to build my own plugin, but I suspect my problems are more general JS problems. Here is a pseudocode sample (note that this is pseudocode and not my actual code, which is a mess at the moment) :

initializeTool: function() {
     //here I am able to access my map object through this.map
     //and I need it for my output
     on(dom.byId("mybutton"), "click", processInput);
}
processInput: function() {
     //pull user data from webpage
     var userData, queries;
     //launch query for all data
     for(var i in userData){
         queries[i] = query(userData[i]);
     }
     //deferredlist is from Dojo, doc here: http://dojotoolkit.org/api/?qs=1.10/dojo/DeferredList
     new DeferredList(queries).then(function (results) {
          //iterate over query responses and perform work
          for(var i in queries){
              //peform some synchronus operations
          }
          //and now we're done! but how do I get to my output?
     }
}

The desired output in this case is a group of objects that have had various operations done on them, but are only accessible in the scope of the then() block and the inline function. My problem is that the output I am trying to use is only in the scope of the initialize function. I'm not sure what the best way to get my processed data to where I want it to be. This is a problem because the processed data is geometry information - it isn't very human readable as text, so it needs to be displayed on a map.

I've been pouring over JS scoping and looking at references to try and figure out what my issue is, but I seriously cannot figure it out.

Answer 1

One of the main points of promises is that then returns a promise for whatever is eventually returned inside its onFulfill handler. This is what enables you to get the outcome out of your processInput() function and into the world outside it.

So you can (and should) do this:

function processInput() {
     //pull user data from webpage
     var userData;

     //launch query for all data
     return Promise.all(userData.map(query))
     .then(function (results) {
          var theResult;
          //iterate over query responses and perform work
          results.forEach(function (result) {
              //peform some synchronus operations and determine theResult
          });
          return theResult;
     });
}

processInput().then(function (theResult) {
    // do something with theResult
});