一招学会Js 根据文件夹目录获取Json数据输出

2023-06-13 05:07:19

如何将文件夹目录转换为 JSON 数据

在组织和管理文件时，文件夹目录是一种非常有用的工具。然而，当您想要处理目录中的数据或将数据导出为其他格式时，可能需要将目录转换为 JSON 格式。本文将逐步指导您完成使用 JavaScript 将文件夹目录转换为 JSON 数据的过程，并将其输出为 JSON 文件。

步骤 1：搭建初始样式（HTML、CSS）

首先，我们需要创建一个基本的 HTML 页面来加载我们的 JavaScript 脚本。在您的文本编辑器中，创建一个新文件并输入以下 HTML 代码：

<!DOCTYPE html>
<html>
<head>
  
</head>
<body>
  <script src="script.js"></script>
</body>
</html>

接下来，让我们添加一些 CSS 样式来设置字体系列：

body {
  font-family: Arial, sans-serif;
}

步骤 2：文件夹目录转换成 JSON 数据

现在，让我们编写 JavaScript 函数来将文件夹目录转换为 JSON 数据。使用 fs 和 path 模块来读取目录并获取文件信息。

function getJsonDataFromDirectory(directory) {
  var fs = require('fs');
  var path = require('path');
  var files = fs.readdirSync(directory);
  var data = {};
  files.forEach(function(file) {
    var filePath = path.join(directory, file);
    var stats = fs.statSync(filePath);
    if (stats.isDirectory()) {
      data[file] = getJsonDataFromDirectory(filePath);
    } else if (stats.isFile()) {
      data[file] = fs.readFileSync(filePath, 'utf8');
    }
  });
  return data;
}

此函数采用一个目录路径作为参数，并递归地遍历目录，将文件夹和文件的信息存储在 data 对象中。

步骤 3：JSON 数据输出成 JSON 文件

最后，我们需要编写一个函数将 JSON 数据写入 JSON 文件。

function writeJsonDataToFile(data, filename) {
  var fs = require('fs');
  var json = JSON.stringify(data, null, 2);
  fs.writeFileSync(filename, json, 'utf8');
}

此函数采用 JSON 数据和文件名作为参数，并将其写入 JSON 文件中，缩进为 2 个空格以提高可读性。

步骤 4：完整代码预览

将所有代码片段组合起来，得到以下完整的 JavaScript 脚本：

function getJsonDataFromDirectory(directory) {
  var fs = require('fs');
  var path = require('path');
  var files = fs.readdirSync(directory);
  var data = {};
  files.forEach(function(file) {
    var filePath = path.join(directory, file);
    var stats = fs.statSync(filePath);
    if (stats.isDirectory()) {
      data[file] = getJsonDataFromDirectory(filePath);
    } else if (stats.isFile()) {
      data[file] = fs.readFileSync(filePath, 'utf8');
    }
  });
  return data;
}

function writeJsonDataToFile(data, filename) {
  var fs = require('fs');
  var json = JSON.stringify(data, null, 2);
  fs.writeFileSync(filename, json, 'utf8');
}

var directory = 'path/to/directory';
var data = getJsonDataFromDirectory(directory);
writeJsonDataToFile(data, 'path/to/json/file.json');

预览

运行脚本后，它将生成一个名为 path/to/json/file.json 的 JSON 文件，内容如下：

{
  "folder1": {
    "file1.txt": "Hello, world!",
    "file2.txt": "This is a test."
  },
  "folder2": {
    "file3.txt": "Another test.",
    "file4.txt": "And another one."
  }
}