javascript - 数组中的奇怪行为

Question

在 NodeJS 中，我试图递归地读取目录及其子目录中的文件

export const readDirRecursively = (rootDir) => {
  const files = [];

  return new Promise((resolve, reject) => {
    // Inner function for recursive operation
    function innerFun(dir) {
      fs.readdir(dir, (err, xpaths) => {
        if (err) reject(err);

        for (let xpath of xpaths) {
          const absPath = path.join(dir, xpath);
          if (fs.statSync(absPath).isDirectory()) {
            innerFun(absPath);
          } else {
            files.push(absPath);
          }
        }
      });
    }

    innerFun(rootDir);  // Call innerFun to initate
    console.log(files);   // contains vaules as expected
    console.log([...files]);  // empty array
    console.log(files.map(file => file + ' test')); // empty array

    const testVar = [1,2,3,4];
    console.log([...testVar]);    // This log [1,2,3,4] as expected

    resolve(files);
  });

};

我发现数组有这种不寻常的行为。调用递归函数后，数组 files 包含预期的项目。但是，当我尝试使用休息/扩展运算符进行映射或复制或对其进行迭代时，该数组结果为空。

我对 [1,2,3,4] 进行了相同的尝试，只是为了确定一下。有了它，一切都会按预期进行。但是，只有 files 数组显示出这种异常行为。

Answer 1

当您记录该数组时，您之后是否会在控制台中将其展开？

您已经记录了一个数组。不是一个值，而是一个对象。因此，当您查看它时，它会显示您查看时的值。但是，当您执行 [...files] 时，这是一个根据旧数组的值构造的新数组(还没有任何数组)，并且这个新数组不会被异步函数，因此您只会看到该空数组。

与 files.map(...) 相同，因为它也会返回一个没有值的新数组。

最后，testVar 在您记录它的时间和您在控制台中查看展开的对象的时间之间不会发生变化。

调试对象时，请考虑使用 console.log(JSON.stringify(files)) 来获取它的“快照”。