title: JavaScript Async/Await console.log() on array returns empty
body: <p>Hello Stack Overflow community, 
  I come to you with a problem related to JS async/await. I am trying to call an async function and then log the array to where the async function pushes the results to the console. If I call it like so directly in the console: </p>
  
  <p>console.log(Page.data) - I can see that it has results in it, but if it is called on click of a button it logs an empty array.</p>
  
  <pre><code>// It is a nested object so do not worry if you don't exactly understand where Page.data comes from
  Page.data = []
  
  async function f1() {
    // Fetch JSON data
    // Process data 
    // Pushes at some point to the Page.data array
  }
  async function f2() {
    // Fetch JSON data
    // Process data 
    // Pushes at some point to the Page.data array
  }
  async function f3() {
    // Fetch JSON data
    // Process data 
    // Pushes at some point to the Page.data array
  }
  
  async function load(loader) {
      let fn = async function() {};
      if(condition1) fn = f1;
      else if(condition2) fn = f2;
      else fn = f3;
  
      // This is the line that makes me problems
      // According to documentation async functions return a promise
      // So why would the array in the case be empty?
      // Since I am telling it to display after the function is done
      await fn(loader).then(console.log(Page.data))
  }
  </code></pre>
  
  <p>This is just a template of my code and logic. I hope that you can understand where I am going.
  Your help will be much appreciated.</p>