为什么不能访问数组元素？ （JavaScript的）

Question

由于某些原因，当元素被推送到FileReader.onload事件函数中的数组时，该数组的元素以后无法访问。请考虑以下代码：

scope.targets = [];

for(var i = 0; i < files.length; i++){
        var reader = new FileReader();
        reader.readAsDataURL(files[i]);

        reader.onload = function(e){
              scope.targets.push(e.target.result);
        };
 }

 console.log(scope.targets);
 console.log(scope.targets[0]);

这是Google Chrome浏览器中console.log（）输出的结果。 正如您所看到的，scope.targets显示有一个string类型的元素。 但是，scope.targets [0]未定义。为什么会这样？有没有其他方法可以访问该元素？

************************** UPDATE ******************** *****************

这是一个解决方案。谢谢你Ashwin Balamohan和nnnnn的答案，它让我找到了解决方案。我找到了我在这里寻找的东西How to implement Progress Bar and Callbacks with async nature of the FileReader

解决方案是：

scope.targets = [];

for(var i = 0; i < files.length; i++){
        var reader = new FileReader();
        reader.readAsDataURL(files[i]);

        reader.onload = function(e){
              scope.targets.push(e.target.result);
              if(i == files.length){
                    callback();
              }
        };
 }

 var callback = function(){
     console.log("scope.targets:");
     console.log(scope.targets);
     console.log("scope.targets[0]:");
     console.log(scope.targets[0]);
 }

Answer 1

你能试试这个

吗？

scope.targets = {};

for(var i = 0; i < files.length; i++){
        var reader = new FileReader();
        reader.readAsDataURL(files[i]);

        reader.onload = function(e){
              scope.targets[i] = (e.target.result);
        };
 }

console.log(scope.targets);
console.log(scope.targets[0]);

Answer 2

代码异步执行。见下面的评论

(sum(len(line.replace("\n",'')) for line in lines) / len(lines))

您可以做的是修改scope.targets = []; for(var i = 0; i < files.length; i++){ var reader = new FileReader(); reader.readAsDataURL(files[i]); // below is an asynchronous call reader.onload = function(e){ scope.targets.push(e.target.result); }; } // the asynchronous calls above may or may not be complete by the time you get here console.log(scope.targets); console.log(scope.targets[0]); 功能，使其在回调中执行reader.onload：

console.log