title: Javascript array length when reading a file
body: <p>I am loading some files form my server via XMLHttpRequest. The loaded files should then be pushed onto an Array object so that I can process them. Here is my code:</p>
  
  <pre><code>var fileList = [];
  
  angular.forEach(images, function(image, key) {
  
  let xhr = new XMLHttpRequest();
  
  xhr.open('GET', '/img/listings/' + image.dir + '/' + image.name, true);
  xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');
  xhr.responseType = 'blob';
  
  xhr.send();
  
  xhr.onload = function() {
      if (xhr.status != 200) { // analyze HTTP status of the response
          alert(`Error ${xhr.status}: ${xhr.statusText}`); // e.g. 404: Not Found
  
      } else {
          var blob = new File([this.response], {type: 'image/png'}); 
          fileList[0] = blob; 
      }
  
  };
  
  console.log(fileList);
  console.log(fileList.length);
  </code></pre>
  
  <p>The result of the console log is:</p>
  
  <pre><code>[]
  0: File {name: "[object Object]", lastModified: 1569449982337, lastModifiedDate: Wed Sep 25 2019 23:19:42 GMT+0100 (British Summer Time), webkitRelativePath: "", size: 77928, …}
  length: 1
  __proto__: Array(0)
  </code></pre>
  
  <p>But the length is 0. Why is the length 0 when it has content.</p>