How to cancel asynchronous execution of JS code?

Question

JavaScript

Good afternoon!
I expect that the loop with requests will be executed, and after that the dispatch(fetchStatus(false)); line will be executed.
And in fact the loop and dispatch(fetchStatus(false)); are executed in parallel
Action:

export const getCheck = (invoices) => async (dispatch, getState) => {
  const { invoices } = getState().personalInformation;

  dispatch(fetchStatus(true));

  for (const invoice of invoices) {
    axios("url" ,invoice)
      .then((data) => {
        dispatch({ type: 'PI_SET_INVOICES_PARAMS', payload: data.Model });
      })
      .catch();
  }


  dispatch(fetchStatus(false));
};

Answer 1

Promise.all
How I do it in projects:

export const deactivateItem = (domenKey, apiKey, ids, activate) => {
  const domenPath = domen[domenKey],
    apiPath = api[apiKey],
    apiList = ids.map((item) =>
      Api.put(`${domenPath}${apiPath}/${item.id}`, { enabled: !!activate })
    );
  return Promise.all(apiList).then((res) => res); // тут можно диспатчить екшены какие надо
};

Answer 2

Just add await before axios.get or wrap invoices in Promise.all

await Promise.all(
    invoices.map(invoice =>
      axios('url', invoice).then(data => {
        dispatch({ type: 'PI_SET_INVOICES_PARAMS', payload: data.Model });
      }),
    ),
  );