0.1.7 • Published 1 year ago
javascriptx v0.1.7
前言: javascript提供的原生方法很多时候需要再次封装才能高效使用,本库提供一些常用的js方法。
String类
方法 | 说明 | 参数 | 返回 |
---|---|---|---|
resovle | 截取一个字符串 | context: 截取前的字符串start: 要截取字符串的前面部分stop: 要截取的字符串的后面部分isTurn: 是否从后向前截取 | String | false |
resovles | 截取一组字符串 | context: 截取前的字符串start: 要截取字符串的前面部分stop: 要截取的字符串的后面部分isTurn: 是否从后向前截取 | String[] | false |
replaceAll | 判断符串是否符合规则 | context: 待替换的字符串oldValue: 替换前的字符串newValue: 替换后的字符串 | String |
replaceAlls | 字符串全局替换 | context: 待替换的字符串oldValues: 替换前的字符串数组newValues: 替换后的字符串数组 | String |
Array类
方法 | 说明 | 参数 | 返回 |
---|---|---|---|
uniq | 数组去重 | arr: 原始数组field: 去重参数(可选) | Array |
intersect | 求出数组交集 | ...array: 至少2个数组;第一个参数可以传去重属性名 | Array |
loopItem | 遍历tree结构数组 | arr: 原始数组func: 递归方法,若返回一个值则停止递归,并返回此值 field: 子对象中的数组值,默认值children level: 当前遍历深度,默认从0开始 parent: 父节点, 默认为空 indexs: 总遍历索引,数组形式,每层所在的index | Array |
mapTree | 对每个节点重新赋值,返回新的tree结构数组 | arr: 原始数组func: 递归方法,返回true则停止递归 field: 子对象中的数组值,默认值children level: 当前遍历深度,默认从0开始 parent: 父节点, 默认为空 indexs: 总遍历索引,数组形式,每层所在的index | Array |
filterTree | 过滤tree结构数组 | arr: 原始数组func: 递归方法,返回true则停止递归 field: 子对象中的数组值,默认值children level: 当前遍历深度,默认从0开始 parent: 父节点, 默认为空 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: 原始数值length: 要保留的小数位数(默认2) | Array |
fixedZero | 左侧补零 | val: 原始数值length: 要补零到最终转换为字符串的长度 | Array |
Object类
方法 | 说明 | 参数 | 返回 |
---|---|---|---|
clone | 克隆出一个新对象 | obj: 要复制的对象func: 是否保留对象内的方法(默认false) | Object |
extend | 合并对象至第一个对象 | ...object 至少2个对象 | Object |
getValue | 获取对象中指定属性的值 | object: 原始对象field: 属性名,支持a.b形式defaultValue: 未取到值时的返回值,默认undefined | value |
setValue | 设置对象的值 | object: 原始对象field: 属性名,支持a.b形式value: 要设置的值force: 是否强制赋值 | object |
isEmpty | 判断对象是否为空 | object: 原始对象except: 要排除的属性(可选) | boolean |
toStr | 将对象转换为字符串只能对比简单对象 | object: 原始对象 | String |
equal | 对比两个对象是否一致只能对比简单对象 | object1: 要对比的对象1object2: 要对比的对象2 | boolean |
changeList | 获取两个对象中,值不一样的属性名列表 | object1: 要对比的对象1object2: 要对比的对象2 | String[] |
renderRecord | 将对象解析到文本中 | text: 文本object: 对象 | String |
renderObject | 将对象解析到文本中 | obj: 对象object: 对象 | object |
renderArray | 将对象以数组方式解析 | arr: 数组obj:对象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