Wait for optional promises and store values

user_1207650 0
Viewed 176

I have a couple of async functions that get and store a value if it has not already been provided.

if (!output.valueA) {
  output.valueA = await getValueA();
}
  
if (!output.valueB) {
  output.valueB = await getValueB();
}

I know I can use Promise.all() to wait for both of these calls asynchronously, but what would be the best way to do this while not knowing whether one or other, or both calls, are even required, and then storing the results in the correct variables?

promise output javascript
3 Answers

You can create an array with all the promises, filter it by presence of a value, and then use Promise.all. You'll also need a 1-to-1 map of property keys to async functions that used to get value for that key:

const fns = {
  "valueA": getValueA,
  "valueB": getValueB,
};

const keys = Object.keys(fns);
// all keys

const missing = keys.filter((key) => !output[key]);
// keys with missing values

const promises = missing.map((key) => fns[key]());
// an array of promises

const results = await Promise.all(promises);
// promise results, obviously

for (const [ index, key ] of missing.entries()) { // using Array.prototype.entries
  output[key] = results[index];
}
user_45548830

Without changing your example a lot you could use then to set a callback that sets the property when resolved. Store the resulting promise inside an array so you know when all promises are finished.

const promises = [];

if (!output.valueA) {
  promises.push(getValueA().then(value => output.valueA = value));
}
  
if (!output.valueB) {
  promises.push(getValueB().then(value => output.valueB = value));
}

await Promise.all(promises);

You can use a more dynamic aproach by defining the properties to check and their async getters up front. An example could be:

const asyncGetters = [["valueA", getValueA], ["valueB", getValueB]];

await Promise.all(
  asyncGetters
    .filter(([prop]) => !output[prop])
    .map(async ([prop, asyncGetter]) => output[prop] = await asyncGetter())
);

Here filter acts like your if statement, selecting only the elements that have a falsy value. map will make sure to collect the promises of the async map callbacks, so you can use await Promise.all() to wait for them all to finish.

user_39825620 

const output = {
  valueA : null,
  valueB: null
};

async function getValueA() {
  await new Promise(r => setTimeout(r, 3000));
  output.valueA = 2;
  return output.valueA;
}

async function getValueB() {
  await new Promise(r => setTimeout(r, 3000));
  output.valueB = 5;
  return output.valueB;
}

async function getAllValues() {
  const promises = [output.valueA || getValueA(), output.valueB || getValueB()];
  await Promise.all(promises);
  console.log(output.valueA);
  console.log(output.valueB);
}

getAllValues();

You can pass Promise.all an array with actual values instead of promises, and it will just resolve immediately. No need to make sure that they're all promises. Try running my code above, but changing output.valueA and valueB to be a number to begin with -- it will resolve immediately.

[edit]

read OPs comment and did this for illustrative purposes:

const output = {
  valueA : null,
  valueB: null
};

async function getValueA() {
  await new Promise(r => setTimeout(r, 3000));
  return 2;
}

async function getValueB() {
  await new Promise(r => setTimeout(r, 3000));
  return 5;
}

async function getAllValues() {
  const promises = [output.valueA || getValueA(), output.valueB || getValueB()];
  const [a, b] = await Promise.all(promises);
  output.valueA = a;
  output.valueB = b;
  console.log(output.valueA);
  console.log(output.valueB);
}

getAllValues();

You can use array destructuring to get the results of a Promise.all

user_19590540
Related