title: Why is this async function is running synchronously?
body: <p>I have some code here...</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>async function test() {
      for(let i = 0; i &lt; 10000; i++){
          console.log("test");
      }
  }
  
  console.log("a");
  test();
  console.log("b");</code></pre>
  </div>
  </div>
  </p>
  
  <p>Now my understanding is that <code>test()</code> here should run asynchronously and if I would want to run a routine after it's completion I would use <code>.then()</code> after it. </p>
  
  <p>I'm not doing that here though so surely it should just do it's thing in the background while everything else contiunes running? With that understanding I would expect some output like this:</p>
  
  <pre><code>a
  b
  test
  test
  ..etc
  </code></pre>
  
  <p>However what I actually get is this...</p>
  
  <pre><code>a
  test
  test
  ...etc
  
  b
  </code></pre>
  
  <p>Why does this happen? It seems that <code>console.log("b")</code> waits until <code>test()</code> completes but that's synchronous behaviour.</p>
  
  <p>Apologies if something similar has been asked before but I couldn't find anything on this myself.</p>