reduce（）一个Promises数组，将每个数组的返回值传递给下一个

Question

I'm having trouble wrapping my head around a certain problem with Promises. I need to take a dynamic array of functions, some of which may return Promises, and call them sequentially using .then .

let fns = [
  ({name, data}) => new Promise((name, data) => {
    console.log(name, data)
    return {name, data: { ...data, logged: true}}
  }),
  ({name, data}) => ({name: name.toLowerCase(), data}),
  ({name, data}) => new Promise((name, data) => {
    setTimeout((name, data) => someAjaxFunction(name, data), 10000)
    return {name, data}
]

What I'm looking for is basically a reduce function that I can use like this:

Promise.resolve({name, data}).then(reduce(fns)).then(({name, data}) => doSomething(name, data))

So reduce should take an array of functions, call them sequentially passing the return value of the last via then , and return a Promise that resolves with the return value of the final function.

Answer 1

Here's the solution I eventually found:

const reduce = (fns, init) => {
  return new Promise(resolve => {
    fns.concat([resolve]).reduce((prev, cur) => prev.then(cur), init)
  })
}

Answer 2

Well... as i have mentioned in my comment you have an interesting to question which requires to mix up synchronous code with asynchronous yet it is doable by some means...

I might come up with a solution as follows;

 let fns = [({name, data}) => new Promise((v,x) => { console.log(name, data); v({name: name, data: data, logged: true}); }), ({name, data}) => ({name: name.toLowerCase(), data: data}), ({name, data}) => new Promise((v,x) => setTimeout((n, d) => v({name: n, data: d, logged: true}), 1000, name, data)) ]; var promises = fns.map(function(f){ var res = f({name:"x",data:[1,2,3]}); // some return promise some not return res.then ? res : Promise.resolve(res); // check if they have a then method }); Promise.all(promises) .then(ps => ps.forEach(v => console.log(v))); 

Answer 3

Here it is in full :

// *** 1 ***
const initialVal = {name:'x', data:'y'};
fns.reduce(function(promise, fn) {
    return promise.then(fn);
}, Promise.resolve(initialVal))
.then(function({name, data}) {
    return doSomething(name, data));
};

or, more compactly :

// *** 2 ***
const initialVal = {name:'x', data:'y'};
fns.reduce((promise, fn) => promise.then(fn), Promise.resolve(initialVal))
.then(({name, data}) => doSomething(name, data));

Or, for reusability you might choose to encapsulate the reduction in a function, say doAsyncSequence() , and pass in the array of functions and the initial value.

// *** 3 ***
function doAsyncSequence(fns, initialVal) => {
    return fns.reduce((promise, fn) => promise.then(fn), Promise.resolve(initialVal));
}
// call as follows
doAsyncSequence(fns, {name:'x', data:'y'}).then(({name, data}) => doSomething(name, data));

Under certain cirumstances it might be more convenient to append the final function to the array of functions and allow it to be handled by the reduction :

// *** 4 ***
// with #3 in place
const myFinalFunction = ({name, data}) => doSomething(name, data);
const initialVal = {name:'x', data:'y'};
doAsyncSequence(fns.concat(myFinalFunction), initialVal);

Your own solution, which attempts to do the same as #3, has a flaw. If init is not thenable, then it will throw synchronously at the first iteration of the reduction. All the solutions above avoid that issue by ensuring with Promise.resolve(initialValue) that the start value is a promise, and avoids the need for new Promise(...) , which is generally expected only when promisifying functions that take callbacks.