使用嵌套承诺解析对象的美妙方法？

Question

While building custom endpoints I often need to resolve a complex object containing promises.

For illustration, take this example:

Given known user's id , employeeId and memberGroupsIds (an array):

var loginResponse = {
    userprofile : getProfile(id)
    companyInfo : {
        company : getCompany(employeeId)
        companyRelations : getPriviligedInfo(employeeId)
    }
    groups : getGroups(memberGroupsIds)
}

This logic works for synchronous functions that just return their values. But with functions that return promises I have to manually push all of them into an array to ensure they are resolved before using the final object.

I find the above code very easy to understand, and I'm looking for a signature that gives some of that, while still ensuring that the promises are resolved before sending a final object to the client.

The problem is not making it work, but making it beautiful and easy to read.

The best answer would ensure that the values are returned to the expected keys in the object and that all the promises are resolved in parallel, while maintaining a structure that is somewhat compatible with that of synchronous functions.

Or, if I'm missing the point and looking at this all wrong, how should I be looking at it?

Answer 1

You could use the helper function below. It takes an object and returns a promise that resolves when all nested promises have been resolved. The returned promise will provide as value the same object, which will have mutated with all its embedded promises replaced by their corresponding values.

function promiseRecursive(obj) {
    const getPromises = obj =>
        Object.keys(obj).reduce( (acc, key) =>
            Object(obj[key]) !== obj[key]
                ? acc
                : acc.concat(
                    typeof obj[key].then === "function"
                        ? [[obj, key]]
                        : getPromises(obj[key])
                  )
        , []);
    const all = getPromises(obj);
    return Promise.all(all.map(([obj, key]) => obj[key])).then( responses =>
        (all.forEach( ([obj, key], i) => obj[key] = responses[i]), obj) 
    );
}

You would call it like this:

var loginResponsePromise = promiseRecursive({
    userprofile : getProfile(10),
    companyInfo : {
        company : getCompany(101),
        companyRelations : getPriviligedInfo(101)
    },
    groups : getGroups([5])
});

 function promiseRecursive(obj) { const getPromises = obj => Object.keys(obj).reduce( (acc, key) => Object(obj[key]) !== obj[key] ? acc : acc.concat(typeof obj[key].then === "function" ? [[obj, key]] : getPromises(obj[key])) , []); const all = getPromises(obj); return Promise.all(all.map(([obj, key]) => obj[key])).then( responses => (all.forEach( ([obj, key], i) => obj[key] = responses[i]), obj) ); } // Example promise-returning functions const wait = ms => new Promise( resolve => setTimeout(resolve, ms) ), getProfile = id => wait(100).then(_ => ({userName: 'user' + id,id})), getCompany = employeeId => wait(200).then(_ => ({employeeName: 'employee' + employeeId, employeeId})), getPriviligedInfo = employeeId => wait(500).then(_ => ({privs: 'privInfo' + employeeId, employeeId})), getGroups = memberGroupsIds => wait(400).then(_ => ({groups: ['group' + memberGroupsIds[0]],memberGroupsIds})); // Sample input passed to `promiseRecursive` function const loginResponsePromise = promiseRecursive({ userprofile : getProfile(10), companyInfo : { company : getCompany(101), companyRelations : getPriviligedInfo(101) }, groups : getGroups([5]) }); // Display the resolved object loginResponsePromise.then( o => console.log(o) ); 

 .as-console-wrapper { max-height: 100% !important; top: 0; } 

Answer 2

I usually solve this kind of scenarios with Bluebird's join http://bluebirdjs.com/docs/api/promise.join.html :

const Promise = require('bluebird');

return Promise.join(
    getProfile(id),
    getCompany(employeeId),
    getPrivilegedInfo(employeeId),
    getGroups(memberGroupsIds),
    (userProfile, company, companyRelations, groups) => {
        return {
            userProfile: userProfile,
            companyInfo: {
                company: company,
                companyRelations: companyRelations
            },
            groups: groups
        };
    }
);

Answer 3

Using new ES6 features I would write something like this:

Promise.all([
    getProfile(id),
    getCompany(employeeId),
    getPriviligedInfo(employeeId),
    getGroups(memberGroupsIds)
])
.then(response => {

    const [ userprofile, company, companyRelations, groups ] = response

    const loginResponse = {
      userprofile,
      companyInfo : {
        company,
        companyRelations
      },
      groups
    }
})
.catch(err => console.error(err))

Maybe the interesting part is that Promise.all() keep the input arguments order not depending on which resolves first. So in next step, using Destructuring Array assignment , the code looks like synchronous.