title: How to wait until Javascript forEach loop is finished before proceeding to next sep
body: <p>I need to wait for all of the axios calls in a function called by a forEach loop to run before I call another function to reload data that should be updated by the axios calls.</p>
  
  <pre><code>function1() {
      let arr = [1, 2, 3, 4, 5];
      arr.forEach((num) =&gt; {
          function2(num);
      });
      //Wait until each call in the forEach loop above
      //is done before running the function3() function.
      function3();
  }
  
  function2(number) {
      axios.post('/internal-url/action/' + number)
          .then((response) =&gt; {
              return response;
          });
  }
  
  function3() {
      console.log('reloading data...');
      /* DB call to reload data */
      console.log('data is reloaded');
  }
  </code></pre>
  
  <p>The problem here is that the data reloads before the axios calls are complete. I know the axios calls worked because I can see they updated in the database, but I need for <code>function1()</code> to wait for all of the axios calls in <code>function2()</code> to finish before running the reload in <code>function3()</code>.</p>
  
  <p>I've tried to make <code>function1()</code> and <code>function2()</code> <code>async/await</code> functions, both at the same time and then individually, but that did not work. How would I go about doing this specifically?</p>