关于javascript：array.length为零，但数组中包含元素


array.length is zero, but the array has elements in it

本问题已经有最佳答案，请猛点这里访问。

我目前正在练习使用电子的过程，但是我对javascript很陌生，遇到了一个让我完全困惑的问题。 我有以下代码：

1
2
3
4
5
6
7
8
9
10
11
12
    function getPaths() {
      var dirPath = document.getElementById("mdir").innerHTML;
      var filePaths = [];
      fs.readdir(dirPath, function(err, dir) {
        for(var i = 0, l = dir.length; i < l; i++) {
          var filePath = dir[i];
          filePaths.push(dirPath +"/" + filePath);
        }
      });
      console.log(filePaths);
      console.log(filePaths.length);
    }

应该查看dirPath定义的目录，然后循环遍历并获取该目录中所有文件的完整路径。 它将它们附加到数组，然后在底部，将数组记录到控制台，然后是数组的长度。
令我感到困惑的是，给定该代码，该阵列将日志记录到控制台，如预期的那样，但是控制台记录的长度为零。 我目前的想法是，它与范围有关，但这没有意义，因为我在正在运行的函数上方的函数中声明了数组filePaths。 除非我错过任何事情。 谁能指出我做错了什么？

readdir是异步的。它不会立即获得结果。您应该在回调中记录filePaths。控制台显示该值的唯一原因是因为控制台在展开数组时会评估该数组。

当您按下左侧的小箭头时，将鼠标放在右侧的i框中。发生的情况是控制台保留了对该数组的引用，因此，当用户展开该数组时，它将显示其当前值。但是，当您登录filePaths.length时，该数组为空，因为readdir尚未完成读取，这就是为什么您得到0的原因。但是当您打开控制台并按该箭头时，readdir已经完成读取，控制台将打印数组的当前值(填充后)。

enter image description here

演示该问题的示例：(不是解决方案，只是为了了解实际情况)

尝试运行以下代码，看看会发生什么：

1
2
3
4
5
6
var arr = [];
setTimeout(function() {
  arr.push(1, 2, 3);
}, 5000);
console.log(arr.length);
console.log(arr);

这里，数组及其长度都在数组填充之前被记录下来。 5秒钟后将填充阵列。因此输出将是0和字符串array[]。现在，由于数组可能包含大量数据，因此在用户展开数组之前，控制台不会显示该数据。因此，控制台要做的就是保留对阵列的引用，直到用户按下展开箭头。如果在5秒钟前展开阵列，您会看到阵列为空(尚未填充)。如果您等到5秒钟过去，然后将其展开，则将看到它已装满。

注意：此外，登录到控制台的行(类似于> Array(0))只是日志发生时对象/数组的字符串表示形式。如果对象/数组发生更改，则不会更新。因此有时似乎也令人困惑。

我希望现在很清楚。

相关讨论

只是为了扩展@ ibrahim-mahrir的答案，他们的意思是这样的

1
2
3
4
5
6
7
8
9
10
11
12
function getPaths() {
    var dirPath = document.getElementById("mdir").innerHTML;
    var filePaths = [];
    fs.readdir(dirPath, function(err, dir) {
        for (var i = 0, l = dir.length; i < l; i++) {
            var filePath = dir[i];
            filePaths.push(dirPath +"/" + filePath);
        }
        console.log(filePaths);
        console.log(filePaths.length);
    });
}