uniapp小程序封装常用工具函数
1. formatTime格式化时间
function formatTime(time, format) {
if (typeof time !== 'number' || typeof format !== 'string') {
return time
}
var formateArr = ['Y', 'M', 'D', 'h', 'm', 's']
var returnArr = []
var date = new Date(time)
returnArr.push(date.getFullYear())
returnArr.push(date.getMonth() + 1)
returnArr.push(date.getDate())
var hour = date.getHours()
returnArr.push(hour > 9 ? hour : '0' + hour)
var minute = date.getMinutes()
returnArr.push(minute > 9 ? minute : '0' + minute)
var second = date.getSeconds()
returnArr.push(second > 9 ? second : '0' + second)
for (var i in returnArr) {
format = format.replace(formateArr[i], returnArr[i])
}
return format
}
该工具函数用于格式化时间戳为指定格式的时间字符串。使用时传入时间戳和格式化格式,返回格式化后的时间字符串。
例如:
let time = formatTime(1555552000, 'Y-M-D h:m:s')
// time = 2019-04-20 16:00:00
传入时间戳是毫秒级的,格式化字符的含义,如Y表示年,M表示月份,D表示日期等。
2. throttle防抖
function throttle(fn, interval) {
var enterTime = 0 // 触发的时间
var gapTime = interval // 间隔时间
var result
return function () {
var context = this
var args = arguments
var nowTime = +new Date()
if (nowTime - enterTime > gapTime) {
fn.apply(context, args)
enterTime = nowTime // 记录本次触发时间
}
}
}
该工具函数用于防止函数被高频触发,产生性能问题。使用时传入需要防抖的函数和防抖间隔时间。返回的函数在间隔时间内再次触发,不会执行函数,直到间隔时间过后再执行函数。
使用例子:
var touchstartFn = throttle(function(){
// 高频触发代码
}, 500)
// 事件绑定
document.addEventListener('touchstart', touchstartFn)
意间隔时间如果间隔时间太长会影响功能,太短无法达到防抖效果。
3. deepClone深拷贝
function deepClone(obj) {
if (typeof obj !== 'object' || obj === null) return obj
let cloneObj = Array.isArray(obj) ? [] : {}
for (let key in obj) {
cloneObj[key] = typeof obj[key] === 'object' ? deepClone(obj[key]) : obj[key]
}
return cloneObj
}
该工具函数用于深拷贝对象、数组。通过递归的方式拷贝对象和数组的所有子属性。
使用例子:
let obj = {
a: 1,
b: {
c: 2
}
}
let cloneObj = deepClone(obj)
obj.a = 2 // 改变obj
console.log(cloneObj.a) // 1 cloneObj未改变
对象或数组嵌套层次不能太深,否则会超出递归调用栈,导致拷贝失败。
4. bitOperator按位运算
function bitOperator(num1, num2, operator) {
switch (operator) {
case '&': // 与
return num1 & num2
case '|': // 或
return num1 | num2
case '^': // 异或
return num1 ^ num2
case '~': // 取反
return ~num1
case '<': // 左移
return num1 << num2
case '>': // 右移
return num1 >> num2
}
}
该工具函数用于执行按位与(&)、或(|)、异或(^)、取反(~)、左移(<)和右移(>)运算。
使用例子:
let result = bitOperator(2, 3, '&') // result = 2 2 & 3 = 2
let result = bitOperator(2, 3, '|') // result = 3 2 | 3 = 3
let result = bitOperator(2, 3, '^') // result = 1 2 ^ 3 = 1
let result = bitOperator(2, 1, '<') // result = 4 2 << 1 = 4
5. randomColor随机颜色
function randomColor() {
let rgb = []
for (let i = 0; i < 3; ++i) {
let color = Math.floor(Math.random() * 256).toString(16)
color = color.length == 1 ? '0' + color : color
rgb.push(color)
}
return '#' + rgb.join('')
}
生成随机颜色,返回格式为#RRGGBB的颜色值。通过随机生成RGB值来得到各种随机颜色。
使用例子:
let color = randomColor()
// color = #52a3ef
使用时无须传参,直接调用即可得到随机颜色。
6. uuid生成UUID
function uuid() {
let s = []
let hexDigits = '0123456789abcdef'
for (let i = 0; i < 36; i++) {
s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1)
}
s[14] = '4' // bits 12-15 of the time_hi_and_version field to 0010
s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1) // bits 6-7 of the clock_seq_hi_and_reserved to 01
s[8] = s[13] = s[18] = s[23] = '-'
let uuid = s.join('')
return uuid
}
该工具函数用于生成UUID(Universally Unique IDentifier)。UUID是一种按照标准生成的编号,通常用来作为标识符,保证全球唯一。
使用例子:
let uuid = uuid()
// uuid = '9b1deb4d-3b7d-4bad-9bdd-2b0d7b3dcb6d'
使用时无须传参,直接调用即可得到UUID。
8. checkIDCard校验身份证
function checkIDCard(idCard) {
let idCardReg = /^[1-9][0-9]{5}([1][9][0-9]{2}|[2][0][0|1][0-9])([0][1-9]|[1][0|1|2])([0][1-9]|[1|2][0-9]|[3][0|1])[0-9]{3}([0-9]|[X])$/
if (!idCardReg.test(idCard)) {
return false
}
let idCardWi = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2]
let idCardY = [1, 0, 'X', 9, 8, 7, 6, 5, 4, 3, 2]
let idCardWiSum = 0
for (let i = 0; i < 17; i++) {
idCardWiSum += idCardWi[i] * idCard[i]
}
let idCardMod = idCardWiSum % 11
let idCardLast = idCardY[idCardMod]
if (idCardLast != idCard[17].toUpperCase()) {
return false
}
return true
}
该工具函数用于校验中国公民身份证号码是否正确。它采用正则表达式判断格式是否正确,并结合校验码算法判断最后一位校验码是否正确。
使用例子:
let valid = checkIDCard('45030319990821232X')
// valid = true
let valid = checkIDCard('45030319990821231X')
// valid = false 最后一位校验码错误
9. checkPhone校验手机号
function checkPhone(phone) {
let phoneReg = /^1[3-9]\d{9}$/
return phoneReg.test(phone)
}
该工具函数用于校验手机号格式是否正确。采用正则表达式匹配11位数的数字,以1开头,第二位数为3-9的手机号。
使用例子:
let valid = checkPhone('18912341234')
// valid = true
let valid = checkPhone('28912341234')
// valid = false 第二位数不在3-9范围内
10. checkEmail校验邮箱
function checkEmail(email) {
let emailReg = /^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/
return emailReg.test(email)
}
该工具函数用于校验邮箱地址格式是否正确。采用正则表达式匹配[email protected]结构的邮箱,其中xxxxx代表5-63个字母、数字、点号或减号。
使用例子:
let valid = checkEmail('[email protected]')
// valid = true
let valid = checkEmail('[email protected]')
// valid = false 中间只有一个点,格式错误
11. isBankCount 校验银行卡格式
function isBankCount(bankno) {
let banknoReg = /^[0-9]{13,25}$/
if (!banknoReg.test(bankno)) {
uni.showToast({
title: '银行卡号格式错误',
icon: 'error',
duration: 2000
})
return false
}
if (bankno.length < 13 || bankno.length > 25) {
uni.showToast({
title: '银行卡号长度错误',
icon: 'error',
duration: 2000
})
return false
}
var newArr = []
for (var i = 0; i < bankno.length; i++) {
newArr.push(bankno.substr(i, 1))
}
if (bankno.length == 19) { // 19位1个校验位
var checkNum = 0
for (var i = 0; i < 18; i++) {
checkNum = checkNum + parseInt(newArr[i]) * (i % 2 == 0 ? 1 : 2)
}
checkNum = checkNum % 10 == 0 ? 10 : checkNum % 10
checkNum = 10 - checkNum
} else if (bankno.length == 20) { // 20位2个校验位
var checkNum1 = 0
var checkNum2 = 0
for (var i = 0; i < 18; i++) {
if (i % 2 == 0) {
checkNum1 = checkNum1 + parseInt(newArr[i])
} else {
checkNum2 = checkNum2 + parseInt(newArr[i]) * 2
if (checkNum2 > 9) checkNum2 = checkNum2 - 9
}
}
checkNum1 = checkNum1 % 10 == 0 ? 10 : checkNum1 % 10
checkNum2 = checkNum2 % 10 == 0 ? 10 : checkNum2 % 10
checkNum1 = 10 - checkNum1
checkNum2 = 10 - checkNum2
}
// Luhn算法
if (bankno.length == 16 || bankno.length == 18) {
var lastNum = bankno.substr(bankno.length - 1, 1)
var first15Num = bankno.substr(0, bankno.length - 1)
var newArr = []
for (var i = first15Num.length - 1; i > -1; i--) {
newArr.push(first15Num.substr(i, 1))
}
// Luhn校验代码...
}
if (checkNum == lastNum && bankno.length == 19) {
return true
} else if (checkNum1 == lastNum[0] && checkNum2 == lastNum[1] && bankno.length == 20) {
return true
} else {
uni.showToast({
title: '银行卡号校验失败',
icon: 'error',
duration: 2000
})
return false
}
}
银行卡号Luhn算法校验,确保卡号输入正确,避免误操作。Luhn算法也称模10算法,是一种简单的校验算法,广泛用于信用卡号、银行卡号等账号的有效性校验。
使用时直接调用参数为银行卡号就行isBankCount(num)
11.isSameMonth 判断两天时间是否是同一个月
function isSameMonth (date1, date2) {
var start = new Date(date1.replace("-", "/").replace("-", "/"));
var end = new Date(date2.replace("-", "/").replace("-", "/"));
return start.getFullYear() == end.getFullYear() && start.getMonth() == end.getMonth();
}
使用方法 ：
isSameMonth (第一天时间，第二天时间)
12.getFirstDay 获取本月第一天是几月几号
function getFirstDay () {
var date = new Date();
var year = date.getFullYear();
var month = date.getMonth() + 1;
var firstDay = year + "-" + month + "-01";
return firstDay;
}
使用方法：
getFirstDay ()直接调用
13.checkDate 两天日期不允许超过指定天数
function checkDate (dataone, datatwo,dayNum) {
var start = new Date(dataone.replace("-", "/").replace("-", "/"));
var end = new Date(datatwo.replace("-", "/").replace("-", "/"));
var days = end.getTime() - start.getTime();
var time = parseInt(days / (1000 * 60 * 60 * 24));
if (time > dayNum) {
uni.showToast({
title: ``两天日期不允许超过${dayNum}天！`,
icon: 'error'
})
return false;
} else {
return true;
}
}
使用方式：
checkDate(第一天时间, 第二天时间,相隔天数)
14.base64src base64转临时路径
function base64src(base64data, fun){
const base64 = base64data; //base64格式图片
const time = new Date().getTime();
const imgPath = wx.env.USER_DATA_PATH + "/poster" + time + "share" + ".mp4";
//如果图片字符串不含要清空的前缀,可以不执行下行代码.
const imageData = base64.replace(/^data:video\/\w+;base64,/, "");
const file = wx.getFileSystemManager();
file.writeFileSync(imgPath, imageData, "base64");
fun(imgPath);
};
使用方法：
base64src('对应的base64码', (res) => {
//res便是临时路径
});
总结
类似的工具函数还有很多，这里暂时不一一列举了，上面提到的银行卡校验，还可以使用阿里公开的一个校验接口https://ccdcapi.alipay.com/validateAndCacheCardInfo.json?cardNo=银行卡号码&cardBinCheck=true 这个接口会返回对应的银行简称,银行卡类型,如果想要显示对应的银行logo的话，可以联系我，由于JSON数据太大，没办法全部放在这里。