但是通过循环读取图像数据

Question

我想通过循环读取图像数据。但它不起作用如何解决此错误？

var i = '';
var file = '';
var reader = '';
var tbase = [];
for (i = 1; i <= 4; i++) {
  var filename = $("#img" + i).val();
  if (filename != '') {
    file = document.getElementById('img' + i).files[0];
    reader = new FileReader();
    reader.onload = function() {
      alert(reader.result);
      tbase[i] = reader.result;
      alert(tbase[i]);
      //localStorage.setItem("foundimage"+i, tbase);
    };
    reader.readAsDataURL(file);
  }
  window.onerror = function(msg, url, linenumber) {
    alert('Error message: ' + msg + '\nURL: ' + url + '\nLine Number: ' + linenumber);
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" name="img4" id="img1">
<input type="file" name="img4" id="img2">
<input type="file" name="img3" id="img3">
<input type="file" name="img4" id="img4">