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中的Location地址对象
Jan 16 Javascript
javascript replace()正则替换实现代码
Feb 26 Javascript
简单实用的全选反选按钮例子
Oct 18 Javascript
js判断运行jsp页面的浏览器类型以及版本示例
Oct 30 Javascript
JavaScript获取DOM元素的11种方法总结
Apr 25 Javascript
node.js下LDAP查询实例分享
Sep 30 Javascript
jquery实现移动端点击图片查看大图特效
Sep 11 Javascript
Bootstrap 附加导航(Affix)插件实例详解
Jun 01 Javascript
Angularjs使用directive自定义指令实现attribute继承的方法详解
Aug 05 Javascript
优雅的elementUI table单元格可编辑实现方法详解
Dec 23 Javascript
vue中过滤器filter的讲解
Jan 21 Javascript
详解Vue后台管理系统开发日常总结(组件PageHeader)
Nov 01 Javascript
优雅地使用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预定义常量
2006/12/25 PHP
ZF等常用php框架中存在的问题
2008/01/10 PHP
基于PHP文件操作的详解
2013/06/05 PHP
php批量删除超链接的实现方法
2015/10/19 PHP
PHP中使用CURL发送get/post请求上传图片批处理功能
2018/10/15 PHP
关于IE7 IE8弹出窗口顶上
2008/12/22 Javascript
javascript之AJAX框架使用说明
2010/04/24 Javascript
统计出现最多的字符次数的js代码
2010/12/03 Javascript
JS画线(实例代码)
2013/11/20 Javascript
js中arguments,caller,callee,apply的用法小结
2014/01/28 Javascript
值得分享的轻量级Bootstrap Table表格插件
2016/05/30 Javascript
用JS实现轮播图效果(二)
2016/06/26 Javascript
jQuery插件HighCharts实现的2D条状图效果示例【附demo源码下载】
2017/03/15 Javascript
微信小程序上滑加载下拉刷新(onscrollLower)分批加载数据(一)
2017/05/11 Javascript
JS实现微信里判断页面是否被分享成功的方法
2017/06/06 Javascript
总结js中的一些兼容性易错的问题
2017/12/18 Javascript
vue环形进度条组件实例应用
2018/10/10 Javascript
vue-cli中使用高德地图的方法示例
2019/03/28 Javascript
在vue中使用setInterval的方法示例
2019/04/16 Javascript
Vue关于组件化开发知识点详解
2020/05/13 Javascript
Python的类实例属性访问规则探讨
2015/01/30 Python
用python找出那些被“标记”的照片
2017/04/20 Python
用pyqt5 给按钮设置图标和css样式的方法
2019/06/24 Python
在Pytorch中使用样本权重(sample_weight)的正确方法
2019/08/17 Python
浅谈Django+Gunicorn+Nginx部署之路
2019/09/11 Python
Pandas DataFrame中的tuple元素遍历的实现
2019/10/23 Python
Python局部变量与全局变量区别原理解析
2020/07/14 Python
Python json解析库jsonpath原理及使用示例
2020/11/25 Python
Python截图并保存的具体实例
2021/01/14 Python
介绍一下内联、左联、右联
2013/12/31 面试题
行政主管职责范本
2014/03/07 职场文书
经营目标责任书
2015/05/08 职场文书
2015年电信员工工作总结
2015/05/26 职场文书
用Python生成会跳舞的美女
2022/01/18 Python
详解Golang如何优雅的终止一个服务
2022/03/21 Golang
如何更改Win11声音输出设备?Win11声音输出设备四种更改方法
2022/04/08 数码科技