Присвоение значения, которое зависит от выполнения нескольких обещаний

Question

Предположим, что a выбирается через API y, а b выбирается через API z. И y, и z вызываются один и только один раз, когда компонент монтируется. После получения a и b мне нужно переназначить a на g(a,b), где g - некоторая функция.

Каков наилучший способ выполнить это?

Я могу подумать об одном: нужно ли мне сначала получить b, а затем, когда обещание, инкапсулирующее b, разрешится, получить a. Затем, когда обещание, инкапсулирующее a, разрешается, переназначьте a на некоторую функцию a и b. Или я мог бы использовать Promise.all

PS: В общем, мне также нужно получить c через API omega. Мне нужно переназначить c на h(g(a,b), c).

Answer 1

Если я правильно вас понял, вы должны использовать Promise.all (). Пример:

async fetchData1() {
  const response = await axios.get(...) // get data1
  this.setState({data1: response.data})
}

async fetchData2() {
  const response = await axios.get(...) //get data2
  this.setState({data2: response.data})
}

async componentDidMount() {
  await Promise.All([this.fetchData1, this.fetchData2])
  yourFunctionForProcessingData(this.state.data1, this.state.data2)
}

Answer 2

Если вы знаете, что вам всегда нужно будет вызывать эти 3 API и что в любом из них произойдет сбой, я бы предложил использовать Promise.all, чтобы просто получить все данные, необходимые для вашей логики c. Что-то вроде:

Promise.all([
   fetchY(),
   fetchZ(),
   fetchOmega()
]).then(([a, b, c]) => {
  const aPrime = g(a,b);
  const cPrime = h(aPrime, c);
  // Pass or store aPrime and cPrime as needed
}).catch((error) => {
    console.log(error);
})

Answer 3

Вы можете использовать следующий код только для ожидания того, что требуется в данный момент времени, чтобы не тратить время на ожидание чего-то, что вам действительно не нужно для продолжения.

componentDidMount(){
    new Promise(async (resolve, reject) => {
        // You don't need result of omega call as of now but no problem in just hitting the api
        let c = fetch(omega).catch(reject);
        // You need the result of both y and z api calls to calculate g(a,b) so await until both calls are complete:
        let [a, b] = await Promise.all([
           fetch(y),
           fetch(z)
        ]).catch(reject);
        a = g(a, b);
        // Now you need result of omega api call so you await c
        await c;
        c = h(a, c); 
        // you have the final result i.e. c here
        resolve(c);
    }).then(result => this.setState({ result }))
      .catch(error => this.setState({ error }));
}