摘要:工具类工具库,封装了处理,,,等常见的函数,是对标准库的补充。业务开发中常用的函数有很多,如等。示例如下整数处理保留两位小数百分比处理亿亿处理万万处理格式化数字大于亿的展示为亿,大于万的展示为万亿万时间处理库。
工具类 lodash
工具库,封装了处理arrays,numbers,objects,string等常见的函数,是对标准库的补充。业务开发中常用的函数有很多,如:assign, times, debounce, get, find, filter, keyBy, cloneDeep, groupBy, omit, pick等。示例如下:
const _ = require("lodash"); const obj = { name: "zhangsan", age: 20, friends: [{ name: "lisi", age: 18 }, { name: "wanger", age: 19 }] }; // 深复制,等价于JSON.parse(JSON.stringify(obj)),但是JSON.parse的形式无法复制函数 const obj2 = _.cloneDeep(obj); obj === obj2; // false // 深获取属性,业务开发中可以取代if(a && a.b && a.b.c)的形式 _.get(obj, "friends[0].age", 0); // 18 // extend properties _.assign({}, { name: "zhangsan" }, { age: 20 }); // { name: "zhangsan", age: 20 } // remove properties _.omit({ name: "zhangsan", age: 20 }, ["age"]); // { name: "zhangsan"} // pick properties _.pick({ name: "zhangsan", age: 20 }, ["age"]); // { age: 20} const arr = [{ name: "zhangsan", age: 20 }, { name: "lisi", age: 19 }, { name: "wanger", age: 18 } ]; _.keyBy(arr, "name"); // { zhangsan: { name: "zhangsan", age: 20 }, lisi: { name: "lisi", age: 19 }, wanger: { name: "wanger", age: 18 } } // debounce(消抖,停止的时候执行一次)和throttle(节流,每间隔一定时候执行一次) _.debounce(keyword => { console.log(keyword); }, 500); // N loop _.times(6, _.uniqueId.bind(null, "key_")); // [ "key_1", "key_2", "key_3", "key_4", "key_5", "key_6" ] // 安全的JSON.parse function safeParse(str, defaultValue) { let result = _.attempt(function(str) { return JSON.parse(str) }, str) return _.isError(result) ? defalutValue : result } safeParse(JSON.stringify({ a: 1 }), {}); // { a: 1 }is-type-of
js类型判断库,可判断js中的类型,包括promise,generator等。示例如下:
is.array([1]) // => true is.null(null) // => true is.undefined(undefined) // => true is.object({a: 1}) // => truenumeral
格式化处理数字。示例如下:
const TEN_THOUSANDS = 10000 const HUNDRED_MILLION = 100000000 numeral(345333).format("0,0’) => ‘345,333’ // 整数处理 numeral(3.45333).format("0.00’) => ‘3.45" // 保留两位小数 numeral(0.9756).format("0.00%’) => ’97.56%’ // 百分比处理 numeral(14321235334343).divide(HUNDRED_MILLION).format("0,0.00’) => ‘143,212.35亿’ //亿处理 numeral(143212353).divide(TEN_THOUSANDS).format("¥0,0.00") => "14,321.24"万 //万处理 // 格式化数字, 大于亿的展示为亿,大于万的展示为万... formatNum() { if(number > HUNDREND_MILLION) { return numeral(number).divide(HUNDREND_MILLION).format(‘0,0.00’) + ‘亿" } else if(number > TEN_THOUSANDS) { return numeral(number).divide(TEN_THOUSANDS).format(‘0,0.00’) + ‘万" } else { return numeral(number).format(‘0,0.00") } }moment.js/day.js
时间处理库。示例如下:
moment().format(‘YYYY-MM-DD")Excel处理 json文件转excel文件
excel-export库,基于node.js将数据生成excel文件,生成格式为xlsx。
// json转excel const nodeExcel = require("excel-export"); const _ = require("lodash"); const fs = require("co-fs"); const co = require("co"); /** * 使用场景: * 导出Excel * * 用法: * params: * - name: excel文件名称 * - path: 导出的excel路径 * * rows: * [ * { * name: "" * _created_at: "" * }, * ..... * ] * * cols: * [ * { * key: "name", * text: "名称" * }, * { * key: "_created_at", * text: "提交时间", * filter: dateStr => { * return dateStr.length === 0 ? dateStr : dateStr.split(".")[0].replace("T", " "); * } * } * ]; */ function wrapConf(rows, cols) { let conf = {}; conf.name = "sheet1"; conf.cols = cols.map(item => { return { caption: item.text, type: item.type || "string", width: item.width || 20 }; }); conf.rows = rows.map((row) => { return cols.map((col) => { if (col.filter) { return col.filter(_.get(row, col.key), row); } else { return _.get(row, col.key); } }); }); return conf; } function* exportExcel(path, rows, cols) { let conf = wrapConf(rows, cols); // 配置项 let result = nodeExcel.execute(conf); // 导出excel return yield fs.writeFile(path, result, "binary"); // 写入到路径 } module.exports = exportExcel;excel文件转json文件
js-xlsx库,读取和解析多种格式表格的js库。
// excel转json const fs = require("co-fs"); const co = require("co"); const XLSX = require("xlsx"); // { // SheetNames: ["sheet1", "sheet2"], // Sheets: { // // worksheet // "sheet1": { // // cell // "A1": { ... }, // // cell // "A2": { ... }, // ... // }, // // worksheet // "sheet2": { // // cell // "A1": { ... }, // // cell // "A2": { ... }, // ... // } // } // } function toJson(workbook, keys) { let result = {}; let sheetNames = workbook.SheetNames; sheetNames.forEach(sheetName => { let worksheet = workbook.Sheets[sheetName]; result[sheetName] = XLSX.utils.sheet_to_json(worksheet, { header: keys }); }); return result; }; /** * * * @param {any} src: excel文件地址 * @param {any} dest: 导出json文件地址 * @param {any} keys: excel列名映射到json的keys * @returns */ function* excelToJson(src, dest, keys) { let data = yield fs.readFile(src) let json = toJson(XLSX.read(data)) return yield fs.writeFile(dest, JSON.stringify(json, 2, 2)) } module.exports = excelToJson;Markdown
markdown文件转html文件,使用marked-toc(生成文件目录),marked(markdown解析库),hightlight(代码高亮)。
const md5 = require("md5"); const markedToc = require("marked-toc"); const marked = require("marked"); const highlight = require("highlight"); const fs = require("fs"); function generateTocName(name) { name = name.trim().replace(/s+/g, "").replace(/)/g, "").replace(/[(,]/g, "-").toLowerCase(); if (/^[w-]+$/.test(name)) { return name; } return `toc-${md5(name).slice(0, 3)}`; } // filePath为markdown文件目录 function markdownToHtml(filePath) { let content = fs.readFileSync(filePath, "utf8"); let tocContent = marked(markedToc(content)).replace(/`; }); return highlightContent; }([^<>]+)/g, (a, b, c) => { return `${c}`; }); let markedContent = marked(content).replace(/ ]*>(.*?)/g, (a, b, c) => { if (b == 2) { return ` ${c} `; } return `${c} `; }); markedContent = markedContent.replace(/]*>([^<>]+)/, (a, b, c) => { return `${a} ${tocContent}`; }); let highlightContent = markedContent.replace(//mg, (a, language, text) => { text = text.replace(/'/g, """).replace(/>/g, ">").replace(/([sS]+?) ${result.value}
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/104568.html
摘要:本人菜鸟一枚,一直也没理解这个,不过看到了就记录一下吧,万一哪天用到了,说不准就懂了或参数的意思是精确的安装指定版本的模块,细心的同学会发现字段里每个模块版本号前面的不见鸟。。。 NPM命令详解平时工作中经常用npm安装,每次用的时候有些命令都要去查一次,这次就自己把这些命令整理下,让自己可以多记住一些。对于还不知道NPM是什么的同学请自行google吧 这里我就不多BB了,主要记录...
摘要:此项目前端使用框架,加上这些常用扩展后的其中还加入了加载器解析工具前端动画等,不需要的可以自行删除。没有的,需要设置淘宝镜像,下载的是国外的镜像,速度慢而且可能出现下载失败的问题。 本篇只是实现了 基础 的功能,对于实际的项目中的权限等还未涉及,这些会在后期逐步完善。相关项目 laravel-vue-iview 的 GitHub 地址 戳这里,此项目基本可用于实际开发工作。 Lara...
摘要:中的配置热加载插件安装中的配置优化插件为组件分配,通过这个插件可以分析和优先考虑使用最多的模块,并为它们分配最小的压缩代码分离和文件 0 前言 本文是针对TCM项目所做的WebPack配置文件总结,主要概述了一些常用配置选项和插件使用,对以后的项目有指导意义。TCM的webpack配置文件包括webapck.config.base.js、webapck.config.dev.js、we...
阅读 1225·2023-04-25 15:53
阅读 2099·2021-11-19 09:40
阅读 3486·2021-10-11 10:59
阅读 2065·2019-08-30 15:55
阅读 1953·2019-08-30 15:54
阅读 2292·2019-08-29 13:03
阅读 2751·2019-08-28 18:17
阅读 1506·2019-08-27 10:51