撸了一个简易的工具库: jeasy
一年前,发现在工作的项目中存在大量使用
monment
的情况,但仅使用到最基础的format功能。monment
的体积直接导致项目体积成倍增加,于是jeasy就诞生了。 jeasy实现了monment
最为常用的功能,并将GridManager中一些工具方法进行了抽离。
安装
npm install jeasy --save
复制代码
方法介绍
Date 日期相关
jeasy.moment() 日期函数
jeasy.moment并不对时区进行处理,如果有需要使用时区的请直接使用moment库。
// number格式的年月日
jeasy.moment(19880102);
// string格式的年月日
jeasy.moment('19880102');
// 使用`/`相隔的字符串
jeasy.moment('1988/01/02 12:12:22');
// 使作`-`相隔的字符串
jeasy.moment('1988-01-02 12:12:22');
// 时间戳
jeasy.moment(1547285063173);
// format
jeasy.moment(1547285063173).format("YYYY-MM-DD"); // 2019-01-12
jeasy.moment(1547285063173).format("YYYY年MM月DD日"); // 2019年01月12日
jeasy.moment(1547285063173).format("YYYY-MM-DD HH:mm:ss"); // 2019-01-12 17:24:23
// 获取年月日
jeasy.moment(1547285063173).fullYear; // 2019
jeasy.moment(1547285063173).year; // 19
jeasy.moment(1547285063173).month; // 1
jeasy.moment(1547285063173).date; // 12
// 获取时分秒
jeasy.moment(1547285063173).hour; // 17
jeasy.moment(1547285063173).minute; // 24
jeasy.moment(1547285063173).second; // 23
// 获取周
jeasy.moment(1547285063173).day; // 6
复制代码
Object 对象与JSON相关
jeasy.equal(object1, object2) 验证两个Object是否相同
// 验证对象
let o1 = {name: 'baukh', age: 31};
let o2 = {name: 'baukh', age: 31};
let o3 = {name: 'kouzi', age: 28};
jeasy.equal(o1, o2); // true
jeasy.equal(o1, o3); // false
// 验证字符串
jeasy.equal('baukh', 'baukh'); // true
// 验证数组
let a1 = [1, 2, 3];
let a2 = [1, 2, 3];
let a3 = [3, 2, 1];
jeasy.equal(a1, a2); // true
jeasy.equal(a1, a3); // false
复制代码
jeasy.index(array, object) 获取Array中Object的索引
let o1 = {name: 'cc', age: 31};
let o2 = {name: 'kouzi', age: 31};
let o3 = {name: 'baukh', age: 31};
let arr = [{name: 'baukh', age: 31}, {name: 'cc', age: 31}];
jeasy.index(arr, o1); // 1
jeasy.index(arr, o2); // -1
jeasy.index(arr, o3); // 0
复制代码
jeasy.find(array, key, value) 通过指定字段筛选Array
const arr = [{name: 'baukh', age: 31}, {name: 'cc', age: 30}, {name: 'kouz', age: 29}, {name: 'rabbit', age: 28}];
jeasy.find(arr, 'name', 'baukh'); // [{name: 'baukh', age: 31}]
jeasy.find(arr, 'age', 29); // [{name: 'kouz', age: 29}]
jeasy.find(arr, 'age', 33); // []
复制代码
jeasy.clone(obj) clone 对象
对 JSON.stringify 存在丢失的类型(如function)不作处理。
let o1 = {name: 'cc', age: 31}; let o2 = jeasy.clone(o1); o1.name; // cc o1 === o2; // false
jeasy.isEmpty(obj) 检测是否为空对象
let o1 = {name: 'cc', age: 31};
let o2 = {};
jeasy.isEmpty(o1); // false
jeasy.isEmpty(o2); // true
复制代码
jeasy.type(value) 获取传参的类型
jeasy.type(undefined); //undefined
jeasy.type(null); // null
jeasy.type(true); // boolean
jeasy.type(Boolean()); // boolean
jeasy.type(123); // number
jeasy.type(Number(123)); // number
jeasy.type('123'); // string
jeasy.type(String('123')); // string
jeasy.type(() => {}); // function
jeasy.type([]); // array
jeasy.type(new Array(1)); // array
jeasy.type(new Date()); // date
jeasy.type(Error()); // error
jeasy.type(/test/); // regexp
jeasy.type(document.body); // element
jeasy.type(nodeList); // nodeList
jeasy.type(divEle); // element
复制代码
jeasy.trim(json) 清除JSON中为[null, undefined]的字段
// 传参为对象
let o = {name: 'kouzi', age: 28, like: null, title: undefined, gender: 0};
jeasy.trim(o); // {name: 'kouzi', age: 28, gender: 0}
// 传参为字符串
let o = ' baukh ';
jeasy.trim(o); // baukh
复制代码
jeasy.toQueryString(formData) Object转换为queryString
// 传参为常规json
jeasy.toQueryString({ name:'zhangsan', age: 12 }); // 'name=zhangsan&age=12'
// 传参存在空值的json
jeasy.toQueryString({ name:'zhangsan', age: '' }); // 'name=zhangsan&age='
// 传参存在null值和对象的json
jeasy.toQueryString({ name: 'zhangsan', params: { name: 'zhangsan', age: 12 }, page: { currentPage: 1, pageSize: 10 }, other: null });
// => 'name=zhangsan¶ms={"name":"zhangsan","age":12}&page={"currentPage":1,"pageSize":10}&other=null'
复制代码
String 字符串相关
jeasy.toHump(str) 连字符转驼峰
jeasy.toHump('font-size'); //fontSize
复制代码
jeasy.toHyphen(str); 驼峰转连字符
jeasy.toHyphen('FontSize'); // -font-size
复制代码
jeasy.toFormData(str) queryString的形式解析成对象
// 常规值
jeasy.toFormData('name=zhangsan&age=22&gender=male') //{name:'zhangsan', age: '22', gender:'male'}
// 首字符为?号型式
jeasy.toFormData('?name=zhangsan&age=22&gender=male') //{name:'zhangsan', age: '22', gender:'male'}
// 包含空值
jeasy.toFormData('name=zhangsan&birth=') //{name:'zhangsan', birth:''}
// 包含类对像值
jeasy.toFormData('name=zhangsan&other={gender: "male"}') //{name:'zhangsan', other: "{gender: \"male\"}"}}
复制代码
Text 文本相关
jeasy.copyText(str) 将文本放粘贴板
jeasy.copyText('font-size'); // 粘贴板中的值为font-size
复制代码
jeasy.getTextWidth(text) 获取文本所占宽度
// 需要注意: 获取的宽度与当前document.body上所设置的`font-size`, `font-weight`, `font-family`有关。
document.body.style.fontSize = '12px';
document.body.style.fontFamily = 'Tahoma';
document.body.style.fontWeight = '400';
jeasy.getTextWidth('aaa'); // 18
jeasy.getTextWidth('测试宽度'); // 48
复制代码
Number 数字相关
jeasy.toPercentile(value, decimal, fixed) 浮点数转换百分位
// @param value: 需要转换的数值
// @param decimal: 保留小数点位数
// @param fixed: 是否强制保留decimal指定的位数
// @returns {*}: 返回百分位格式的字符串
jeasy.toPercentile(0.1230123, 1); // '12.3%'
jeasy.toPercentile(0.1230123, 2); // '12.30%'
jeasy.toPercentile(0.1230123, 2, false); // '12.3%'
复制代码
jeasy.toThousands(value, decimal, fixed) 浮点数转换千分位
// @param value: 需要转换的数值
// @param decimal: 保留小数点位数
// @param fixed: 是否强制保留decimal指定的位数
// @returns {*}: 返回千分位格式的字符串
jeasy.toThousands(value, 1); // '123.0‰'
jeasy.toThousands(value, 1, false); // '123‰'
jeasy.toThousands(value, 2); // '123.01‰'
jeasy.toThousands(value, 2, false); // '123.01‰'
复制代码
File 文件相关
jeasy.download(response, fileName);
// @param response: 通过后端接口返回二进制流(blob)。response允许两种格式: 1.blob; 2.{data: blob};
// @param fileName: 文件名称
jeasy.download(response, fileName); // 文件下载
复制代码
推荐
作者:baukh789
链接:https://juejin.im/post/5de9cf9ff265da33d451eb19
来源:掘金
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
撸了一个简易的工具库: jeasy的更多相关文章
- 撸了一个简易的配置中心,顺带整合到了SpringCloud
大家好,我是三友~~ 最近突然心血来潮(就是闲的)就想着撸一个简单的配置中心,顺便也照葫芦画瓢给整合到SpringCloud. 本文大纲 配置中心的概述 随着历史的车轮不断的前进,技术不断的进步,单体 ...
- 用canvas写一个简易画图工具
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 基于 getter 和 setter 撸一个简易的MVVM
Angular 和 Vue 在对Angular的学习中,了解到AngularJS 的两个主要缺点: 对于每一次界面时间,Ajax 或者 timeout,都会进行一个脏检查,而每一次脏检查又会在内部循环 ...
- Js简易代码生成工具
代码 javascript:(function(){ document.body.innerHTML = '<textarea id="txtTemplate" style= ...
- JavaScript工具库
jPublic 交流QQ群:1017567122 前言 在我们开发项目的时候,无论项目规模大小,在所难免会写一些工具型函数来解决一些问题,随着项目开发和维护的时间越来越长,这些工具型函数会越来越多,同 ...
- RandomAccessFile实现简易记事本工具操作
package seday03; import java.io.IOException; import java.io.RandomAccessFile; import java.util.Scann ...
- 学以致用:手把手教你撸一个工具库并打包发布,顺便解决JS浮点数计算精度问题
本文讲解的是怎么实现一个工具库并打包发布到npm给大家使用.本文实现的工具是一个分数计算器,大家考虑如下情况: \[ \sqrt{(((\frac{1}{3}+3.5)*\frac{2}{9}-\fr ...
- Opencv探索之路(二十):制作一个简易手动图像配准工具
近日在做基于sift特征点的图像配准时遇到匹配失败的情况,失败的原因在于两幅图像分辨率相差有点大,而且这两幅图是不同时间段的同一场景的图片,所以基于sift点的匹配已经找不到匹配点了.然后老师叫我尝试 ...
- GitBook是一个命令行工具(Node.js库),我们可以借用该工具使用Github/Git和Markdown来制作精美的图书,但它并不是一本关于Git的教程哟。
GitBook是一个命令行工具(Node.js库),我们可以借用该工具使用Github/Git和Markdown来制作精美的图书,但它并不是一本关于Git的教程哟. 支持输出多种格式 GitBook支 ...
随机推荐
- Elasticsearch:运用search_after来进行深度分页
在上一篇文章 "Elasticsearch:运用scroll接口对大量数据实现更好的分页",我们讲述了如何运用scroll接口来对大量数据来进行有效地分页.在那篇文章中,我们讲述了 ...
- IDEA 2019.1版本 永久激活(假装是永久激活,其实还是有时间的,不过这个时间比较长)
先下载 一个 jar 包 链接: https://pan.baidu.com/s/12eC8OZzMrUve2xC7aRUKLQ 提取码: bavi 将下载下来的jar包,放置你安装idea的目录的b ...
- localstorage ie11不支持
据我所知,localstorage在高版本的ie.谷歌.火狐下都是支持的,以前没在ie上看过,不清楚,今天我用ie11打开我vue编译后的html,竟然发现不支持localstorage了,用仿真的i ...
- 【Java-算法】 十六进制转字节数组
Java Code public class Convert{ public static void main(String args[]) { String sHex = "00 B6 0 ...
- js上传整个文件夹
文件夹上传:从前端到后端 文件上传是 Web 开发肯定会碰到的问题,而文件夹上传则更加难缠.网上关于文件夹上传的资料多集中在前端,缺少对于后端的关注,然后讲某个后端框架文件上传的文章又不会涉及文件夹. ...
- 【记录】springboot项目的maven的pom.xml文件第一行报错 Unknown Error
原因 : maven的插件版本的问题,造成与IDE的不兼容 解决办法 :在pom中加上 <maven-jar-plugin.version>3.1.1</maven-jar-plug ...
- nuxt使用教程
1 引言 Nuxt 是基于 Vue 的前端开发框架,这次我们通过 Introduction toNuxtJS 视频了解框架特色以及前端开发框架的基本要素. nuxt 与 next 结构很像,可以结合在 ...
- Light Switching(SPOJ LITE)—— 线段树成段更新异或值
题目连接:http://www.spoj.com/problems/LITE/en/. 题意:有若干个灯泡,每次对一段操作,这一段原先是亮的,就关了:原先是关着的,就打开.询问某一段的打开的灯泡的个数 ...
- Android学习——MediaProvider与Music模块
一.MediaProvider数据库介绍 1. 关系型数据库 关系模型的物理表示是一个二维表格,由行和列组成. 2. MediaProvider数据库存储位置 /data/data/com.a ...
- 单调队列优化dp,k次移动求最长路
洛谷2254 给你k次移动 每次移动给你一个时间段 a,b和方向dir 地图上有障碍物 为了不撞上障碍物你可以施法让箱子停下来 问箱子可以走的最长路 ((以下是洛谷的题解)) /*首先考虑对于时间t来 ...