title: Strange behavior inside async function
body: <p>I'm learning Promises and I tried to fetch some data inside an async function.</p>
  <p>Here's the snippet -</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>import "./styles.css";
  import axios from "axios";
  
  let jsonPlaceholder = axios.create({
    baseURL : "https://jsonplaceholder.typicode.com/"
  })
  
  let fetchData = async () =&gt; {
    console.log("INSIDE FETCH DATA FUNCTION")
    let response = await jsonPlaceholder.get('/users');
    return response.data;
  }
  
  let runSetTimeoutTenTimes = () =&gt; {
    for(let i=0; i&lt;10; i++) {
      setTimeout(async () =&gt; {
         let data = await fetchData();          
         console.log("HERE IS THE USER DATA....",data);
      })
    }
  }
  
  runSetTimeoutTenTimes();</code></pre>
  </div>
  </div>
  </p>
  <p>I was expecting the output similar to the below format in console:</p>
  <pre><code>INSIDE FETCH DATA FUNCTION
  HERE'S THE DATA....
  (10) [Object, Object, Object, Object, Object, Object, Object, Object, Object, Object]
  
  INSIDE FETCH DATA FUNCTION
  HERE'S THE DATA....
  (10) [Object, Object, Object, Object, Object, Object, Object, Object, Object, Object]
  .
  .
  .
  </code></pre>
  <p>However I am getting data in the below format:</p>
  <p><a href="https://i.stack.imgur.com/pml4P.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/pml4P.png" alt="Screenshot" /></a></p>
  <p>It looks like <code>fetchData</code> is run 10 times and then fetched data are logged one by one.</p>
  <p><a href="https://codesandbox.io/s/optimistic-cohen-cfey5?file=/src/index.js:0-529" rel="nofollow noreferrer">Here is the Codesandbox link</a></p>
  <p>What am I missing here ?</p>
  <p><strong>EDIT:</strong></p>
  <p>If I replace the <code>fetchData</code> and <code>runSetTimeoutTenTimes</code> with the below functions I am getting the desired result:</p>
  <pre><code>let fetchData_1 = async () =&gt; {
    console.log(&quot;INSIDE FETCH DATA FUNCTION&quot;)
    return;
  }
  
  let runSetTimeoutTenTimes = () =&gt; {
    for(let i=0; i&lt;10; i++) {
      setTimeout(async () =&gt; {
         await fetchData();          
         console.log(&quot;HERE IS THE USER DATA....&quot;);
      })
    }
  } 
  </code></pre>