Node.js折腾记一:读指定文件夹,输出该文件夹的文件树详解


Posted in Javascript onApril 20, 2019

前言

用来干什么:想干嘛干嘛
为什么写:写来玩,学习node.js文件系统相关api;树结构这种东西还是挺不错的,会用会造才是真的会
用了什么: fs.readdir(dir), fs.stat(dir).isFile(), path处理路径等

思路:

  1. 读取当前文件夹(不是文件夹的另作处理),获得其下所有文件和目录组成的数组;
  2. 循环该数组,判断是文件夹还是文件,文件的话直接push到childFiles(对象有两个属性:short文件名,full完整文件路径)
  3. 文件夹的话,先把当前文件夹作为key,存到父级文件夹的childDir属性下,然后自调用传当前文件夹路径
  4. 每一层文件夹都包含三个属性:dir文件夹路径,childFiles子文件,childDir子文件夹,存储为对象结构
  5. 以上步骤重复,直到达到最底层空文件夹或该文件夹只有文件

输出的样子components-dir-tree.json

{
  "dir": "D:\\node-test\\components",
  "childFiles": [
    {
      "short": "components-dir-tree.json",
      "full": "D:\\node-test\\components\\components-dir-tree.json"
    },
    {
      "short": "file.js",
      "full": "D:\\node-test\\components\\file.js"
    },
    {
      "short": "index.js",
      "full": "D:\\node-test\\components\\index.js"
    }
  ],
  "childDir": {
    "no": null,
    "test": {
      "dir": "D:\\node-test\\components\\test",
      "childFiles": [],
      "childDir": {
        "aa": {
          "dir": "D:\\node-test\\components\\test\\aa",
          "childFiles": [
            {
              "short": "bb.js",
              "full": "D:\\node-test\\components\\test\\aa\\bb.js"
            }
          ],
          "childDir": {
            "cc": null
          }
        }
      }
    }
  }
}

。

目录结构(仅components)

...
|-- components
    -- index.js
    -- file.js
    -- components-dir-tree.json  // 生成的文件树对象的输出文件,方便查看
    -- no
    -- test
       -- aa
        -- cc

使用

将输出结果格式化写入到json文件,看起来一目了然

components/index.js:
/**
 * init
 */
require('console-color-mr'); // 命令行样式
const fs = require('fs');
const path = require('path');
const { getDirTree, getDirName } = require('./file.js');

const componentDir = path.resolve(__dirname, './');
// console.log('componentDir: ', componentDir);

const ComponentInit = (function init() {
 console.log('______ init ______'.blueBG, '\n');
 let treeObj = getDirTree(componentDir);
 // console.log('treeObj: ',treeObj);
 if (treeObj) {
  let outdir = `${__dirname}\\${getDirName(componentDir)}-dir-tree.json`;
  // 写入文件
  fs.writeFile(outdir, JSON.stringify(treeObj, '', '\t'), 'utf8', (err) => {
   if (err) throw err;
   console.log(`目录树已输出为文件保存: ${outdir}`.greenBG);
  });
 }
 return init;
})();

module.exports = ComponentInit;

主函数 getDirTree:

/components/file.js
const fs = require('fs');

/**
 * 获取目录下的文件树
 * @param {读取的路径} dir
 * @returns 返回 dir 目录下的文件树
 */
function getDirTree(dir) {
 let obj = {
  dir: dir, // 文件夹路径
  childFiles: [], // 子文件
  childDir: {} // 子目录
 };
 let objStr = JSON.stringify(obj);
 if (isFile(dir)) return console.log(`${dir}: 不是文件夹`.redBG);
 
 // 读取目录
 let files = readDir(dir);
 if (!files.length) console.log(`${dir}: 文件夹为空`.redBG);
 
 // 遍历文件
 files.forEach(file => {
  let tempdir = `${dir}\\${file}`;
  if (isFile(tempdir)) {
   obj.childFiles.push({
    short: file, // 文件名
    full: tempdir // 完整路径
   });
   
  } else {
   // console.log('tempdir: ',tempdir);
   let dirname = getDirName(tempdir);
   // 在当前文件夹的对象下 childDir 属性(1),以文件夹名作为key(2),
   // (2)的值是该目录下 路径dir、childFiles子文件、childDir子文件夹组成的对象或null
   obj.childDir[dirname] = getDirTree(tempdir);
  }
 });
 return JSON.stringify(obj) === objStr ? null : obj;
}

工具函数 readDir/isFile

// 读取路径下的文件、文件夹
function readDir(dir) {
 return fs.readdirSync(dir, (err, files) => {
  if (err) throw err;
  // console.log(`${dir}, files: `.green, files);
  // if (!files.length) console.log(`${dir}: 文件夹为空`.redBG);
  return files;
 })
}

// 判断制定路径是否是文件
function isFile(dir) {
 return fs.statSync(dir).isFile();
}

// 获取目录名
function getDirName(dir) {
 let tempdir = dir.substr(dir.lastIndexOf('\\')+1, dir.length);
 return tempdir;
}

// const components_out = readFile(path.resolve(__dirname, './components-dir-tree.json'));
// console.log('components-dir-tree: ', components_out);

// 读取指定目录的文件
function readFile(dir) {
 let result = fs.readFileSync(dir, 'utf-8');
 return (
  result 
  ? {
   dir: dir,
   result: result
  } 
  : null
 );
}

module.exports = {
 getDirTree,
 readDir,
 isFile,
 readFile
}

完结,撒花,撒花!

以上所述是小编给大家介绍的Node.js读指定文件夹输出该文件夹文件树详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript编程起步(第一课)
Jan 10 Javascript
用cookies实现的可记忆的样式切换效果代码下载
Dec 24 Javascript
js程序中美元符号$是什么
Jun 05 Javascript
基于JQuery.timer插件实现一个计时器
Apr 25 Javascript
js取消单选按钮选中并判断对象是否为空
Nov 14 Javascript
js判断60秒以及倒计时示例代码
Jan 24 Javascript
JavaScript中判断整数的多种方法总结
Nov 08 Javascript
bootstrap 模态框(modal)实现水平垂直居中显示
Jan 23 Javascript
JS实现异步上传压缩图片
Apr 22 Javascript
微信小程序实现点击返回顶层的方法
Jul 12 Javascript
详解Vue3.0 前的 TypeScript 最佳入门实践
Jun 18 Javascript
jQuery+css实现的点击图片放大缩小预览功能示例【图片预览 查看大图】
May 29 jQuery
优雅地使用loading(推荐)
Apr 20 #Javascript
详解JavaScript的数据类型以及数据类型的转换
Apr 20 #Javascript
详解key在Vue列表渲染时究竟起到了什么作用
Apr 20 #Javascript
函数式编程入门实践(一)
Apr 20 #Javascript
vue路由对不同界面进行传参及跳转的总结
Apr 20 #Javascript
详解Vue+Element的动态表单,动态表格(后端发送配置,前端动态生成)
Apr 20 #Javascript
详解vue使用$http服务端收不到参数
Apr 19 #Javascript
You might like
php使用ereg验证文件上传的方法
2014/12/16 PHP
php随机生成数字字母组合的方法
2015/03/18 PHP
yii2.0数据库迁移教程【多个数据库同时同步数据】
2016/10/08 PHP
thinkphp框架实现路由重定义简化url访问地址的方法分析
2020/04/04 PHP
JavaScript 继承详解 第一篇
2009/08/30 Javascript
理解Javascript_05_原型继承原理
2010/10/13 Javascript
js获取ajax返回值代码
2014/04/30 Javascript
详细分析使用AngularJS编程中提交表单的方式
2015/06/19 Javascript
jQuery鼠标经过方形图片切换成圆边效果代码分享
2015/08/20 Javascript
浅谈JavaScript for循环 闭包
2016/06/22 Javascript
概述VUE2.0不可忽视的很多变化
2016/09/25 Javascript
js中json处理总结之JSON.parse
2016/10/14 Javascript
微信开发 消息推送实现代码
2016/10/21 Javascript
jQuery实现二维码扫描功能
2017/01/09 Javascript
微信小程序实现加入购物车滑动轨迹
2020/11/18 Javascript
[15:58]DOTA2国际邀请赛采访专栏:Tongfu.Sansheng&KingJ,DK.rOtk
2013/08/08 DOTA
[06:42]DOTA2每周TOP10 精彩击杀集锦vol.1
2014/06/25 DOTA
[03:42]2016国际邀请赛中国区预选赛首日现场玩家采访
2016/06/26 DOTA
python中字符串类型json操作的注意事项
2017/05/02 Python
同时安装Python2 & Python3 cmd下版本自由选择的方法
2017/12/09 Python
Python 绘图库 Matplotlib 入门教程
2018/04/19 Python
Python实现定制自动化业务流量报表周报功能【XlsxWriter模块】
2019/03/11 Python
python爬取基于m3u8协议的ts文件并合并
2019/04/26 Python
Django中的cookie和session
2019/08/27 Python
春节到了 教你使用python来抢票回家
2020/01/06 Python
Python 字符串池化的前提
2020/07/03 Python
HTML5 表单验证失败的提示语问题
2017/07/13 HTML / CSS
莱德杯高尔夫欧洲官方商店:Ryder Cup Shop
2019/08/14 全球购物
奢华的意大利皮革手袋:Bene Handbags
2019/10/29 全球购物
Sql面试题
2013/03/20 面试题
2014年手术室工作总结
2014/11/26 职场文书
经理聘任证明
2015/03/02 职场文书
2015年房地产个人工作总结
2015/05/26 职场文书
公司备用金管理制度
2015/08/04 职场文书
CSS 制作波浪效果的思路
2021/05/18 HTML / CSS
SQLServer 错误: 15404,无法获取有关 Windows NT 组/用户 WIN-8IVSNAQS8T7\Administrator 的信息
2021/06/30 SQL Server