前端开发有时会处理一部分后台返回的数据,或者根据数据判断做一些处理。这个时候就非常有必要将一些常用的工具类封装起来,今天老男孩老师就为大家分享工具类封装的59 个方法,当然还有很多用的较少前期没有录入,后期持续跟新。感兴趣的小伙伴们别忘了关注!
使用
1.方法一
npm i -S utils-lan
import utils from 'utils-lan'
console.log(utils.arrJudge(['1','2']))
3.关于类名
是根据字面量来命名的,方法首个驼峰表示所属类型,后面是方法作用;
如 arrAndSet 一看就是数组的方法,是处理交集的;
如果实在难以忍受,可以采用方法 2,导入本地对项目进行更改.
1.arrAndSet
并集
/** * 数组并集,只支持一维数组 * @param {Array} arrOne * @param {Array} arrTwo */ export const arrAndSet = (arrOne, arrTwo) => { return arrOne.concat(arrTwo.filter(v => !arrOne.includes(v))) } 复制代码
2.arrIntersection
交集
/** * 数组交集,只支持一维数组 * @param {Array} arrOne * @param {Array} arrTwo */ export const arrIntersection = (arrOne, arrTwo) => { return arrOne.filter(v => arrTwo.includes(v)) } 复制代码
3.arrDifference
差集
/** * 数组差集,只支持一维数组 * @param {Array} arrOne * @param {Array} arrTwo * eg: [1, 2, 3] [2, 4, 5] 差集为[1,3,4,5] */ export const arrDifference = (arrOne, arrTwo) => { return arrOne.concat(arrTwo).filter(v => !arrOne.includes(v) || !arrTwo.includes(v)) } 复制代码
4.arrTwoToArrObj
两个数组合并成一个数组对象
/** * 两个数组合并成一个对象数组,考虑到复杂度,所以目前支持两个一维数组 * @param {Array} arrOne * @param {Array} arrTwo * @param {oneKey} oneKey 选填,如果两个都未传,直接以 arrOne 的值作为 key,arrTwo 作为 value * @param {twoKey} twoKey */ export const arrTwoToArrObj = (arrOne, arrTwo, oneKey, twoKey) => { if(!oneKey&&!twoKey){ return arrOne.map((oneKey, i) => ({ [oneKey]:arrTwo[i] })) }else{ return arrOne.map((oneKey, i) => ({ oneKey, twoKey: arrTwo[i] })) } } 复制代码
5.arrObjSum
数组对象求和
/** * 数组对象求和 * @param {Object} arrObj 数组对象 * @param {String} key 数组对应的 key 值 */ export const arrObjSum = (obj, key) => { return arrObj.reduce((prev, cur) => prev + cur.key, 0) } 复制代码
6.arrConcat
数组合并
/** * 数组合并,目前合并一维 * @param {Array} arrOne 数组 * @param {Array} arrTwo 数组 */ export const arrConcat = (arrOne, arrTwo) => { return [...arrOne, ...arrTwo] } 复制代码
7.arrSum
数组求和
/** * 数组求和 * @param {Array} arr 数组 */ export const arrSum = arr => { return arr.reduce((prev, cur)=> { return prev + cur }, 0) } 复制代码
8.arrIncludeValue
数组是否包含某值
/** * 数组是否包含某值 * @param {Array} arr 数组 * @param {} value 值,目前只支持 String,Number,Boolean */ export const arrIncludeValue = (arr, value) => { return arr.includes( value) } 复制代码
9.arrMax
数组最大值
/** * 数组最大值 * @param {Array} arr 数组 */ export const arrMax = arr => { return Math.max(...arr) } 复制代码
10.arrRemoveRepeat
数组去重
/** * 数组去重 * @param {Array} arr 数组 */ export const arrRemoveRepeat = arr => { return Array.from(new Set(arr)) } 复制代码
11.arrOrderAscend
数组排序
/** * 数组排序 * @param {Array} arr 数组 * @param {Boolean} ascendFlag 升序,默认为 true */ export const arrOrderAscend = (arr, ascendFlag=true) => { return arr.sort((a, b) => { return ascendFlag ? a - b : b - a }) } 复制代码
12.arrJudge
判断是否是数组
/** * 判断是否是数组 * @param {Array}} arr 数组 */ export const arrJudge = arr => { if (Array.isArray(arr)) { return true } } 复制代码
13.checkNum
判断是否是数字
/** * 判断是否是数字 * @param {Number} data */ export const checkNum = data => { const reg = /^d{1,}$/g if (reg.test(data)) return true } 复制代码
14.checkLetter
判断是否是字母
/** * 判断是否是字母 * @param {Number} data */ export const checkLetter = data => { const reg = /^[a-zA-Z]+$/g if (reg.test(data)) return true } 复制代码
15.checkLowercaseLetter
判断是否全部是小写字母
/** * 判断是否全部是小写字母 * @param {Number} data */ export const checkLowercaseLetter = data => { const reg = /^[a-z]+$/g if (reg.test(data)) return true } 复制代码
16.checkCapitalLetter
判断是否是大写字母
/** * 判断是否是大写字母 * @param {Number} data */ export const checkCapitalLetter = data => { const reg = /^[A-Z]+$/g if (reg.test(data)) return true } 复制代码
17.checkNumOrLetter
判断是否是字母或数字
/** * 判断是否是字母或数字 * @param {Number || String} data 字符或数字 */ export const checkNumOrLetter = data => { const reg = /^[0-9a-zA-Z]*$/g if (reg.test(data)) return true } 复制代码
18.checkChinese
判断是否是中文
/** * 判断是否是中文 * @param {String} data 中文 */ export const checkChinese = data => { const reg = /^[\u4E00-\u9FA5]+$/g if (reg.test(data)) return true } 复制代码
19.checkChineseNumberLettter
判断是否是中文,数字或字母
export const checkChineseNumberLettter = data => { const reg = /^[a-zA-Z0-9\u4e00-\u9fa5]+$/g if (reg.test(data)) return true } 复制代码
20.checkEmail
判断是否是邮箱地址
/** * 判断是否是邮箱地址 * @param {String} data */ export const checkEmail = data => { const reg = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/g if (reg.test(data)) return true } 复制代码
21.checkTelphone
判断是否是手机号
/** * 判断是否是手机号,只要是13,14,15,16,17,18,19开头即可 * @param {String} data */ export const checkTelphone = data => { const reg = /^((+|00)86)?1[3-9]d{9}$/g if (reg.test(data)) return true } 复制代码
22.checkUrl
判断是否是正确的网址
/** * 判断是否是正确的网址 * @param {String} url 网址 */ export const checkUrl = url => { const a = document.createElement('a') a.href = url return [ /^(http|https):$/.test(a.protocol), a.host, a.pathname !== url, a.pathname !== `/${url}` ].find(x => !x) === undefined }