array.length为零，但数组中包含元素 [英] array.length is zero, but the array has elements in it

问题描述

我目前正在练习使用电子，但我对javascript很新，我遇到了一个令我感到困惑的问题。我有以下代码：

I'm currently in the process practicing using electron, but I'm quite new with javascript and I've come across a problem which has me completely baffled. I have the following code:

    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 。除非我错过了什么。谁能指出我做错了什么？

Which is supposed to look into a directory defined by dirPath, then it loops through and obtains the full path of all files in that directory. It appends them to an array, and then at the bottom, it logs the array to the console, followed by the length of the array. What is baffling me is that given that code, the array logs to the console like expected, but then the console logs zero as the length. My current thinking is that it's got something to do with scope, but that doesn't make sense because I'm declaring the array, filePaths in the function above the one that's running. Unless I've missed something. Could anyone point out what I'm doing wrong?

推荐答案

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

readdir is asynchronous. It won't get the result right away. You should log the filePaths inside the callback. The only reason why the console show the value is because the console evaluate the array when you unfold it.

当您按下左侧的小箭头时，将鼠标按下右边的 i 框。发生的事情是控制台保留对数组的引用，因此当用户展开数组时，它会显示其当前值。但是当你记录 filePaths.length 时，数组是空的，因为 readdir 还没有读完，那就是你得到0的原因但是当你打开控制台并按下那个箭头时， readdir 已经完成读取，控制台将打印数组的当前值（填充后） 。

When you press the little arrow on the left, put the mouse on the i box on the right. What happen is that the console keeps a reference to the array, so when the user unfold the array it then show what its current value is. But when you log filePaths.length the array is empty because readdir didn't finish reading yet that's why you get 0. But by the time you open the console and press that arrow, readdir will already be done reading and the console will print the current value of the array (after it been filled).

示例演示问题:(不是解决方案，只是要了解实际发生的事情）

尝试并运行此代码，看看会发生什么：

Try and run this code and see what happen:

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

此处数组及其长度都在数组填充之前记录。阵列将在5秒后填满。因此输出将是 0 和字符串 array [] 。现在因为数组可能有大量数据，控制台不会显示数据，直到用户展开数组。所以控制台所做的是保持对阵列的引用，直到用户按下展开箭头。如果在5秒之前展开数组，则会看到数组为空（尚未填充）。如果你等到5秒过去然后展开它，那么你会看到它被填满。

Here the array and it's length are both logged before the array is filled. The array will be filled after 5 seconds. So the output will be 0 and a string array[]. Now because arrays could have tons of data, the console won't show that data untill the user unfold the array. So what the console does is keep a reference to the array untill the user press unfold arrow. If you unfold the array before 5 seconds you see that the array is empty (not filled yet). If you wait untill the 5 seconds pass then unfold it, then you'll see that it's filled.

注意：此外，该行登录到控制台（类似> Array（0））只是日志发生时对象/数组的字符串表示。如果对象/数组发生更改，它将不会更新。所以有时也可能会出现 令人困惑 。

Note: Also, the line that get logged to the console (something like > Array(0)) is just a string representation of the object/array at the moment the log happens. It won't get updated if the object/array changes. So that also may seem confusing sometimes.

我希望现在很清楚。

这篇关于array.length为零，但数组中包含元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！