# trample
> A Web/Node General Utils Library
Latest version **0.4.0** (published 2021-04-28) · MIT license · 0 weekly downloads
## Install
```sh
npm install trample
pnpm add trample
yarn add trample
bun add trample
```
## Health
**Score 20/100 (F)** — status: abandoned.
Positive: esm support; no vulnerabilities.
Warnings: low downloads; no types; pre 1.0.
Negative: abandoned; low maintenance score.
## Facts
| | |
|---|---|
| Version | 0.4.0 |
| Published | 2021-04-28 |
| First published | 2020-01-29 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Node | >= 8.0.0 |
| Dependencies | 3 |
| Unpacked size | 303.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Joway Young |
| Maintainers | yangzw |
| Keywords | trample, trample.js, util, tool, js, javascript, common, node, web, array, cookie, date, dom, fs, function, number, object, process, regexp, storage, string, type, url |
## Links
- npm: https://www.npmjs.com/package/trample
- Repository: https://github.com/JowayYoung/trample
- Homepage: https://github.com/JowayYoung
- Issues: https://github.com/JowayYoung/trample/issues
- npm.io page: https://npm.io/package/trample
## Dependencies (3)
- [rimraf](https://npm.io/package/rimraf.md) 3.0.2
- [copy-dir](https://npm.io/package/copy-dir.md) 1.3.0
- [make-dir](https://npm.io/package/make-dir.md) 3.1.0
## Alternatives
- [@mapbox/jsonlint-lines-primitives](https://npm.io/package/@mapbox/jsonlint-lines-primitives.md) — 5.3M weekly downloads
- [reftools](https://npm.io/package/reftools.md) — 3.5M weekly downloads
- [@hey-api/openapi-ts](https://npm.io/package/@hey-api/openapi-ts.md) — 3.5M weekly downloads
- [@mapbox/geojson-rewind](https://npm.io/package/@mapbox/geojson-rewind.md) — 2.4M weekly downloads
- [turbo-stream](https://npm.io/package/turbo-stream.md) — 1.7M weekly downloads
## Recent versions
- 0.4.0 (latest) — 2021-04-28
- 0.3.0 — 2021-04-28
- 0.2.3 — 2020-07-13
- 0.2.2 — 2020-07-13
- 0.2.1 — 2020-07-09
- 0.2.0 — 2020-07-09
- 0.1.0 — 2020-04-17
- 0.0.9 — 2020-03-24
- 0.0.8 — 2020-03-24
- 0.0.7 — 2020-02-22
- 0.0.6 — 2020-02-04
- 0.0.5 — 2020-02-04
- 0.0.4 — 2020-02-01
- 0.0.3 — 2020-01-31
- 0.0.2 — 2020-01-29
- … 1 more at https://npm.io/package/trample/versions
## README
# Trample 
[](https://github.com/JowayYoung/trample)
[](https://github.com/JowayYoung/trample)
[](https://github.com/JowayYoung/trample)
[](https://github.com/JowayYoung/trample)
[](https://github.com/JowayYoung/trample)
[](https://github.com/JowayYoung/trample)
[](https://github.com/JowayYoung/trample)
[](https://github.com/JowayYoung/trample)
### 前言
**工欲善其事，必先利其器**。应用在项目开发上就是：`做好一个项目，前期的工作准备非常重要`。项目开发的前期准备无非都是`合理规划项目结构`、`按需编写构建代码`、`批量创建入口文件`、`复制粘贴工具函数`等。
在此先推荐笔者写的一个**React/Vue应用自动化构建脚手架**[bruce-cli](https://github.com/JowayYoung/bruce-cli)，其零配置开箱即用的优点非常适合入门级、初中级、快速开发项目的前端同学使用，还可通过创建`brucerc.js`文件来覆盖其默认配置，只需专注业务代码的编写无需关注构建代码的编写，让项目结构更简洁。
通过`bruce-cli`能把常规的前期准备都解决了，但我们经常会复制粘贴一些之前项目常用的工具函数过来新项目上，新开其他项目时又会重新执行这些操作。
项目开发过程中时常会重复使用一些工具函数，例如`浏览器类型`、`格式时间差`、`URL参数反序列化`、`过滤XSS`等，为了避免项目开发时重复的复制粘贴操作带来不必要的麻烦，笔者将平时常用的一些工具函数按功能分类和统一封装，并发布到`npm`上。每次项目开发时直接安装，提高开发效率，将时间用在正确的事情上。
### 安装
- 使用`npm`安装：`npm i trample`
- 使用`yarn`安装：`yarn add trample`
### 使用
`trample`根据**Web**和**Node**两种JS运行环境划分代码，生成两种`bundle.js`。每种文件在不同JS运行环境下运行，必须根据JS运行环境引用文件，否则会报错。
##### 区别
模块|工具库|运行环境|对应文件|ESM的对应文件
:-:|:-:|:-:|-|-
**Web**|Web函数工具库|浏览器|`web.js`|`web.esm.js`
**Node**|Node函数工具库|服务器|`node.js`|`node.esm.js`
##### 兼容
- **Web**：`>= 95%`
- **Node**：`>= 8.0.0`
##### 引用
`trample`使用`rollup`打包，因此可使用`IIFE`、`AMD`、`CJS`、`UMD`和`ESM`五种方式引用。但推荐使用`IIFE`、`CJS`、`ESM`三种引用方式。工具库的代码使用`ESM`规范开发，使用`export {}`导出。
> IIFE引用方式
适用于`Web`，最简单最方便的引用方式没有之一。把`node_modules/trample/dist/web.umd.js`复制出来，放到新建的`js/trample`文件夹下，通过HTML的`
```
> AMD引用方式
适用于`Web`。把`node_modules/trample/dist/web.umd.js`复制出来，放到新建的`js/trample`文件夹下，需建立在`require.js`下使用。
```js
require.config({
paths: {
trample: "js/trample/web.umd.js"
}
});
require(["trample"], function(trample) {
console.log(trample.BrowserType());
});
```
> CJS引用方式
适用于`Web`和`Node`。
```js
// Web
const { BrowserType, TypeOf } = require("trample");
// const { BrowserType, TypeOf } = require("trample/dist/web");
console.log(TypeOf("trample"));
console.log(BrowserType());
// Node
const { NodeType, TypeOf } = require("trample/dist/node");
console.log(TypeOf("trample"));
console.log(NodeType());
```
> ESM引用方式
适用于`Web`和`Node`。若使用`ESM`规范开发项目，有利于Wepack启用`TreeSharking`移除未使用的代码。
```js
// Web
import { BrowserType, TypeOf } from "trample";
// import { BrowserType, TypeOf } from "trample/dist/web";
console.log(TypeOf("trample"));
console.log(BrowserType());
// Node
import { NodeType, TypeOf } from "trample/dist/node";
console.log(TypeOf("trample"));
console.log(NodeType());
```
##### 再次提醒
在`Web`环境下，请使用以下导入方式⏬。`trample`默认引用`node_modules/trample/dist/web.js`这个文件。
```js
const { BrowserType, TypeOf } = require("trample");
// 或
import { BrowserType, TypeOf } from "trample";
// 『上面两段代码』 等价 『下面两段代码』(推荐)
const { BrowserType, TypeOf } = require("trample/dist/web");
// 或
import { BrowserType, TypeOf } from "trample/dist/web";
```
在`Node`环境下，请使用以下导入方式⏬。
```js
const { NodeType, TypeOf } = require("trample/dist/node");
// 或
import { NodeType, TypeOf } from "trample/dist/node";
```
`trample`提供`ESM`规范的`index.esm.js`，在`package.json`中已配置`module`字段指向`index.esm.js`。
若使用`webpack`打包项目可利用`Tree Sharking`特性移除未使用代码，有效减小打包体积。配置如下。
```js
module.exports = {
// webpack其他配置
resolve: {
mainFields: ["module", "jsnext:main", "main"]
}
};
```
### 文档
```!
暂时未接入TypeScript实现函数入参校验，请遵循文档指定的入参类型传参
```
##### 公共函数工具库
[Array 数组工具](https://github.com/JowayYoung/trample/blob/master/src/common/array.js)
- [x] **GroupMemKey()**：分组成员特性
- arr：数组(`[]`)
- key：属性(`""`)
- [x] **RecordMemPosition()**：记录成员位置
- arr：数组(`[]`)
- val：值(`""`)
- [x] **StatMemCount()**：统计成员个数
- arr：数组(`[]`)
- [x] **StatMemKeyword()**：统计成员所含关键字
- arr：数组(`[]`)
- keys：关键字集合(`[]`)
```js
const arr = [
{ area: "GZ", name: "YZW", age: 27 },
{ area: "GZ", name: "TYJ", age: 25 },
{ area: "GZ", name: "LJY", age: 26 },
{ area: "FS", name: "LXY", age: 24 }
];
GroupMemKey(arr, "area"); // { GZ: Array(3), FS: Array(1) }
const arr = [2, 1, 5, 4, 2, 1, 6, 6, 7];
RecordMemPosition(arr, 2); // [0, 4]
const arr = [0, 1, 1, 2, 2, 2];
StatMemCount(arr); // { 0: 1, 1: 2, 2: 3 }
const text = [
"今天天气真好，我想出去钓鱼",
"我一边看电视，一边写作业",
"小明喜欢同桌的小红，又喜欢后桌的小君，真TM花心",
"最近上班喜欢摸鱼的人实在太多了，代码不好好写，在想入非非"
];
const keyword = ["偷懒", "喜欢", "睡觉", "摸鱼", "真好", "一边", "明天"];
StatMemKeyword(text, keyword); // ["喜欢", "摸鱼", "真好", "一边"]
```
[Date 日期工具](https://github.com/JowayYoung/trample/blob/master/src/common/date.js)
- [x] **FormatCountdown()**：格式倒计时
- time：时间(`null`，格式为`YYYY-MM-DD HH:mm:ss`，Safari格式为`YYYY/MM/DD HH:mm:ss`)
- 备注：用于`未来时间`
- [x] **FormatDiffTime()**：格式时间差
- time：时间(`null`，格式为`YYYY-MM-DD HH:mm:ss`，Safari格式为`YYYY/MM/DD HH:mm:ss`)
- 备注：可用于`未来时间`或`过去时间`
```js
FormatCountdown("2021-01-31"); // "367天15时55分17秒"
FormatDiffTime("2019-03-31"); // "10个月前"
```
[Function 函数工具](https://github.com/JowayYoung/trample/blob/master/src/common/function.js)
- [x] **AsyncTo()**：格式异步返回值
- pfn：Promise函数(`Promise.resolve(true)`)
- 备注：必须在`async函数`或`自执行async函数`下使用
- [x] **Debounce()**：防抖
- fn：函数(`v => v`)
- dura：时延(`50`)
- [x] **Throttle()**：节流
- fn：函数(`v => v`)
- dura：时延(`50`)
- [x] **WaitFor()**：等待
- dura：时延(`1000`)
- 备注：必须在`async函数`或`自执行async函数`下使用
```js
document.body.addEventListener("click", () => Debounce(() => console.log("Click"), 2000));
document.body.addEventListener("scroll", () => Throttle(() => console.log("Scroll"), 2000));
(async() => {
const [err, res] = await AsyncTo(GetData());
await WaitFor(2000);
console.log(err, res);
})();
```
[Number 数值工具](https://github.com/JowayYoung/trample/blob/master/src/common/number.js)
- [x] **ByteSize()**：字节大小
- byte：字节(`0`)
- [x] **FillNum()**：补零数值
- num：数值(`0`)
- len：补位(`0`)
- [x] **RandomNum()**：范围随机数
- min：最小数(`0`)
- max：最大数(`10`)
- [x] **RandomNumPlus()**：N个范围随机数
- min：最小数(`0`)
- max：最大数(`10`)
- count：个数(`1`)
- [x] **RoundNum()**：精确数值(`四舍五入`和`百分比`)
- num：数值(`0`)
- dec：小数个数(`2`)
- per：是否百分比(`false`)
- [x] **ThousandNum()**：千分数值
- num：数值(`0`)
```js
ByteSize(683468); // "667 KB"
FillNum(999, 4); // "0999"
RandomNum(0, 100); // 88
RandomNumPlus(0, 100, 3); // [40, 59, 27]
RoundNum(0.331234, 2, true); // "33.12%"
ThousandNum(12345.6789); // "12,345.6,789"
```
[Object 对象工具](https://github.com/JowayYoung/trample/blob/master/src/common/object.js)
- [x] **GetKeys()**：读取属性
- obj：对象(`{}`)
- keys：属性集合(`[]`)
```js
const obj = { a: 1, b: 2, c: 3, d: 4 };
const keys = ["a", "d"];
GetKeys(obj, keys); // { a: 1, d: 4 }
```
[Regexp 正则工具](https://github.com/JowayYoung/trample/blob/master/src/common/regexp.js)
- [x] **CheckText()**：校验文本
- type：类型(`""`，可选`address地址、count数量、date日期、email邮件、idcard身份证、image图片、name名称、number计数、password密码、phone手机`)
- text：文本(`""`)
- 备注：内置以上几种常用校验文本，如不符合需求请使用以下的`CheckTextPlus()`
- [x] **CheckTextPlus()**：自定义校验文本
- regexp：正则(`new RegExp()`)
- msg：提示(`""`)
- text：文本(`""`)
- [x] **MatchBracketText()**：匹配括号文本
- tgt：括号形式(`"(*)"`，提取的内容必须使用`*`代替)
- text：文本(`""`)
```js
CheckText("email", "young.joway@aliyun"); // { flag: false, msg: "邮箱只能由xxx@yyy.zzz形式组成" }
CheckTextPlus(/^(fe)?male$/g, "性别输入错误", "male"); // { flag: true, msg: "" }
MatchBracketText(
"