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 学习小结(适合新手参考)
Jul 30 Javascript
js常用代码段收集
Oct 28 Javascript
JavaScript中的DSL元编程介绍
Mar 15 Javascript
AngularJS基础 ng-non-bindable 指令详细介绍
Aug 02 Javascript
jquery实现简单的瀑布流布局
Dec 11 Javascript
js多个物体运动功能实例分析
Dec 20 Javascript
原生JS实现的多个彩色小球跟随鼠标移动动画效果示例
Feb 01 Javascript
小程序实现上下移动切换位置
Sep 23 Javascript
three.js利用gpu选取物体并计算交点位置的方法示例
Nov 25 Javascript
JavaScript实现Excel表格效果
Feb 07 Javascript
vue二选一tab栏切换新做法实现
Jan 19 Vue.js
小程序自定义轮播图圆点组件
Jun 25 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
Linux下安装PHP MSSQL扩展教程
2014/10/24 PHP
Discuz不使用插件实现简单的打赏功能
2019/03/21 PHP
ThinkPHP框架整合微信支付之刷卡模式图文详解
2019/04/10 PHP
php中目录操作opendir()、readdir()及scandir()用法示例
2019/06/08 PHP
THINKPHP5.1 Config的配置与获取详解
2020/06/08 PHP
php+mysql+ajax 局部刷新点赞/取消点赞功能(每个账号只点赞一次)
2020/07/24 PHP
javascript 面向对象编程 万物皆对象
2009/09/17 Javascript
为EasyUI的Tab标签添加右键菜单的方法
2012/07/14 Javascript
JQuery 给元素绑定click事件多次执行的解决方法
2014/09/09 Javascript
BOOTSTRAP时间控件显示在模态框下面的bug修复
2015/02/05 Javascript
JS获取及设置TextArea或input文本框选择文本位置的方法
2015/03/24 Javascript
基于JS实现PHP的sprintf函数实例
2015/11/14 Javascript
VUE写一个简单的表格实例
2019/08/06 Javascript
javascript导出csv文件(excel)的方法示例
2019/08/25 Javascript
微信小程序按钮点击动画效果的实现
2019/09/04 Javascript
Vue select 绑定动态变量的实例讲解
2020/10/22 Javascript
[04:50]2019DOTA2高校联赛秋季赛四强集锦
2019/12/27 DOTA
Python 过滤字符串的技巧,map与itertools.imap
2008/09/06 Python
Python实现全局变量的两个解决方法
2014/07/03 Python
python3新特性函数注释Function Annotations用法分析
2016/07/28 Python
python读取一个目录下所有txt里面的内容方法
2018/06/23 Python
Python将列表数据写入文件(txt, csv,excel)
2019/04/03 Python
如何用Python做一个微信机器人自动拉群
2019/07/03 Python
pandas.DataFrame的pivot()和unstack()实现行转列
2019/07/06 Python
python实现微信自动回复机器人功能
2019/07/11 Python
基于python traceback实现异常的获取与处理
2019/12/13 Python
HTML5中语义化 b 和 i 标签
2008/10/17 HTML / CSS
详解HTML5中的Communication API基本使用方法
2016/01/29 HTML / CSS
大二自我鉴定
2014/01/31 职场文书
优秀部门获奖感言
2014/02/14 职场文书
2015年电工工作总结
2015/04/10 职场文书
2015年学校总务处工作总结
2015/05/19 职场文书
thinkphp 获取控制器及控制器方法
2021/04/16 PHP
python小程序之飘落的银杏
2021/04/17 Python
解析laravel使用workerman用户交互、服务器交互
2021/04/28 PHP
python引入其他文件夹下的py文件具体方法
2021/05/23 Python