javascriptx
Version:
javascript 基础库扩展
138 lines (106 loc) • 7.98 kB
Markdown
前言：
javascript提供的原生方法很多时候需要再次封装才能高效使用，本库提供一些常用的js方法。
String类
| 方法 | 说明 | 参数 | 返回 |
| ----------- | -------------------- | ------------------------------------------------------------ | ----------------- |
| resovle | 截取一个字符串 | context: 截取前的字符串<br />start: 要截取字符串的前面部分<br />stop: 要截取的字符串的后面部分<br />isTurn: 是否从后向前截取 | String \| false |
| resovles | 截取一组字符串 | context: 截取前的字符串<br />start: 要截取字符串的前面部分<br />stop: 要截取的字符串的后面部分<br />isTurn: 是否从后向前截取 | String[] \| false |
| replaceAll | 判断符串是否符合规则 | context: 待替换的字符串<br />oldValue: 替换前的字符串<br />newValue: 替换后的字符串 | String |
| replaceAlls | 字符串全局替换 | context: 待替换的字符串<br />oldValues: 替换前的字符串数组<br />newValues: 替换后的字符串数组 | String |
| | | | |
Array类
| 方法 | 说明 | 参数 | 返回 |
| --------- | ------------ | ------------------------------------------ | ----- |
| uniq | 数组去重 | arr: 原始数组<br />field: 去重参数（可选） | Array |
| intersect | 求出数组交集 | ...array: 至少2个数组；第一个参数可以传去重属性名 | Array |
| loopItem | 遍历tree结构数组 | arr: 原始数组<br />func: 递归方法，若返回一个值则停止递归，并返回此值<br /> field: 子对象中的数组值,默认值children<br /> level: 当前遍历深度，默认从0开始<br /> parent: 父节点， 默认为空<br /> indexs: 总遍历索引，数组形式，每层所在的index | Array |
| mapTree | 对每个节点重新赋值，返回新的tree结构数组 | arr: 原始数组<br />func: 递归方法，返回true则停止递归<br /> field: 子对象中的数组值,默认值children<br /> level: 当前遍历深度，默认从0开始<br /> parent: 父节点， 默认为空<br /> indexs: 总遍历索引，数组形式，每层所在的index | Array |
| filterTree | 过滤tree结构数组 | arr: 原始数组<br />func: 递归方法，返回true则停止递归<br /> field: 子对象中的数组值,默认值children<br /> level: 当前遍历深度，默认从0开始<br /> parent: 父节点， 默认为空<br /> indexs: 总遍历索引，数组形式，每层所在的index | Array |
| | | | |
```import { uniq, intersect } from 'javascriptx';```
```
var arr1 = [1, 1, 2, 3];
uniq(arr1); //output: [1, 2, 3]
var arr2 = [{id: 1}, {id: 1}, {id: 2}]
uniq(arr2, "id"); //output: [{id: 1}, {id: 2}]
```
```
var arr1 = [1, 2, 3];
var arr2 = [2, 3, 4];
var arr3 = [3, 4, 5];
intersect(arr1, arr2); //output: [2, 3]
intersect(arr1, arr2, arr3); //output: [3]
var arr4 = [{id: 1}, {id: 2}, {id: 3}];
var arr5 = [{id: 2}, {id: 3}, {id: 4}];
intersect("id", arr1, arr2); //output: [{id: 2}, {id: 3}]
```
```import { loopItem, mapTree, filterTree } from 'javascriptx';```
```
var tree = [{value: 1, children: [{value: 10}, {value: 11}]}, {value: 5}];
const item = loopItem(tree, (item, index, { arr, level, parent, indexs }) => {
if (item.value === 11) {
// 每个item都会进入一次， 以value=11的这个item为例。输出：
console.log('item', item); // {value: 11} 当前节点
console.log('index', index); // 1 当前节点在children中的index
console.log('arr', arr); // [{value: 10}, {value: 11}] 当前节点所在的children
console.log('level', level); // 1 当前节点所在深度
console.log('parent', parent); // {value: 1, children: [{value: 10}, {value: 11}]} 当前节点的父节点
console.log('indexs', indexs); // [0, 1] 当前节点的每一级的index
return item;
}
});
console.log(item); // {value: 11} 返回return的内容
const newTree = mapTree(tree, (item, index, { arr, level, parent, indexs }) => {
return { price: item.value };
});
console.log(newTree); // [{price: 1, children: [{price: 10}, {price: 11}]}, {price: 5}]
const newTree2 = filterTree(tree, (item, index, { arr, level, parent, indexs }) => {
if (item.value >= 5) {
return true;
}
});
console.log(newTree2); // [{price: 5}]
var arr2 = [{id: 1}, {id: 1}, {id: 2}]
uniq(arr2, "id"); //output: [{id: 1}, {id: 2}]
```
```
var arr1 = [1, 2, 3];
var arr2 = [2, 3, 4];
var arr3 = [3, 4, 5];
intersect(arr1, arr2); //output: [2, 3]
intersect(arr1, arr2, arr3); //output: [3]
var arr4 = [{id: 1}, {id: 2}, {id: 3}];
var arr5 = [{id: 2}, {id: 3}, {id: 4}];
intersect("id", arr1, arr2); //output: [{id: 2}, {id: 3}]
```
Number类
| 方法 | 说明 | 参数 | 返回 |
| --------- | ---------- | --------------------------------------------------------- | ----- |
| toFix | 保留小数位 | number: 原始数值<br />length: 要保留的小数位数（默认2） | Array |
| fixedZero | 左侧补零 | val: 原始数值<br />length: 要补零到最终转换为字符串的长度 | Array |
| | | | |
Object类
| 方法 | 说明 | 参数 | 返回 |
| ------ | ---------------- | ------------------------------------------------------------ | ------ |
| clone | 克隆出一个新对象 | obj: 要复制的对象<br />func: 是否保留对象内的方法（默认false） | Object |
| extend | 合并对象至第一个对象 | ...object 至少2个对象 | Object |
| getValue | 获取对象中指定属性的值 | object: 原始对象<br />field: 属性名，支持a.b形式<br />defaultValue: 未取到值时的返回值，默认undefined | value |
| setValue | 设置对象的值 | object: 原始对象<br />field: 属性名，支持a.b形式<br />value: 要设置的值<br />force: 是否强制赋值 | object |
| isEmpty | 判断对象是否为空 | object: 原始对象<br />except: 要排除的属性（可选） | boolean |
| toStr | 将对象转换为字符串<br />*只能对比简单对象* | object: 原始对象 | String |
| equal | 对比两个对象是否一致<br />*只能对比简单对象* | object1: 要对比的对象1<br />object2: 要对比的对象2 | boolean |
| changeList | 获取两个对象中，值不一样的属性名列表 | object1: 要对比的对象1<br />object2: 要对比的对象2 | String[] |
| renderRecord | 将对象解析到文本中 | text: 文本<br />object: 对象 | String |
| renderObject | 将对象解析到文本中 | obj: 对象<br />object: 对象 | object |
| renderArray | 将对象以数组方式解析 | arr: 数组<br />obj:对象<br />object:对象 | Array |
使用方法:
```import { resovle, getValue, setValue, renderRecord } from 'javascriptx';```
输入：`resovle("<a>js-utils</a>", "<a>", "</a>");`
输出：`js-utils`
输入：`var obj = {a: {b: 1}};`
`getValue(obj, 'a.b');`
输出：`1`
输入：`setValue(obj, 'a.b.c', 2, true);`
输出：`{a: {b: {c: 2}}}`
输入：`renderRecord('c is ${a.b.c}', obj);`
输出：`c is 2`