本文分享了一系列实用的JavaScript代码片段，涵盖了URL参数解析、日期格式化、手机号处理、正则验证、数值操作、字符串处理、数组操作、密码强度检测、金额大写转换等常见需求，为前端开发者提供便捷的工具箱。
整理了下 平时项目自己常用的方法，编写了一个自己的小助手
/**
* 获取指定url内所有参数obj
* @param url 要处理的url
*/
function getRequest(url) {
let theRequest = {};
if (url.indexOf('?') !== -1) {
let str = url.substr(url.indexOf('?'), url.length);
str = str.substr(1);
let strs = str.split('&');
for (let i = 0; i < strs.length; i++) {
theRequest[strs[i].split('=')[0]] = unescape(strs[i].split('=')[1])
}
}
return theRequest
}
/**
* 获取当前url内指定参数
* @param name 要获取的参数名
*/
function getUrlParam(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) return (r[2]);
return null;
}
/**
* 日期格式转换
* @param fmt 要处理成的日期格式 例: 'yyyy-MM-dd hh:mm:ss'
* @param date 要处理的日期，需Date类型
*/
function dateFormat(fmt, date) {
date = date ? date : new Date();
let o = {
"M+": date.getMonth() + 1, //月份
"d+": date.getDate(), //日
"h+": date.getHours() % 12 === 0 ? 12 : date.getHours() % 12, //小时
"H+": date.getHours(), //小时
"m+": date.getMinutes(), //分
"s+": date.getSeconds(), //秒
"q+": Math.floor((date.getMonth() + 3) / 3), //季度
"S": date.getMilliseconds() //毫秒
};
let week = {
"0": "/u65e5",
"1": "/u4e00",
"2": "/u4e8c",
"3": "/u4e09",
"4": "/u56db",
"5": "/u4e94",
"6": "/u516d"
};
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
}
if (/(E+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, ((RegExp.$1.length > 1) ? (RegExp.$1.length > 2 ? "/u661f/u671f" : "/u5468") : "") + week[date.getDay() + ""]);
}
for (let k in o) {
if (new RegExp("(" + k + ")").test(fmt)) {
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
}
}
return fmt;
}
/**
*隐藏中间4位数的手机号码
* @param val 要隐藏的手机号
*/
function hidePhone(val){
let tel = JSON.stringify(val);
let reg=/(\d{3})\d{4}(\d{4})/;
tel = tel.replace(reg, "$1****$2")
return tel
}
/**
* 验证手机号码
* @param val 要验证的手机号
*/
function checkPhone(val) {
if (!(/^1[3456789]\d{9}$/.test(val))) {
return false;
}
return true;
}
/**
* 验证身份证
* @param val 要验证的身份证
*/
function checkIdCard(val) {
if (!(/(^\d{15}&)|(^\d{18})|(^\d{17}(\d|X|x)$)/.test(val))) {
return false;
}
return true;
}
/**
* 验证邮箱
* @param val 要验证的邮箱
*/
function checkIdCard(val) {
if (!(/^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/.test(val))) {
return false;
}
return true;
}
/**
* 小数点后 四舍五入自动补两个零
* @param val 要处理的数值
*/
function amountFillZero(val) {
val = Math.round(parseFloat(val) * 100) / 100;
let dot = val.toString().split('.');
if (dot.length === 1) {
val = val.toString() + '.00';
} else if (dot.length > 1) {
if (dot[1].length < 2) {
val = val.toString() + '0'
}
}
return val
}
/**
* 只能输入数字和两位小数
* 举例：<input type="text" οninput="inputNum()" />
* @param e
*/
function inputNum(e){
e.currentTarget.value = e.currentTarget.value.replace(/[^\d.]/g,""); //清除"数字"和"."以外的字符
e.currentTarget.value = e.currentTarget.value.replace(/^\./g,""); //验证第一个字符是数字
e.currentTarget.value = e.currentTarget.value.replace(/\.{2,}/g,"."); //只保留第一个, 清除多余的
e.currentTarget.value = e.currentTarget.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
e.currentTarget.value = e.currentTarget.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3'); //只能输入两个小数
}
/**
* 只能输入整数
* 举例：<input type="text" οninput="inputIntegerNum()" />
* @param e
*/
function inputIntegerNum(e) {
e.currentTarget.value = e.currentTarget.value.replace(/\D/gi,"")
}
/**
* 去除字符串空格
* @param str 要处理的字符串
* @param type 1：所有空格 2：前后空格 3：前空格 4：后空格
*/
function strTrim(str,type){
switch (type){
case 1:return str.replace(/\s+/g,"");
case 2:return str.replace(/(^\s*)|(\s*$)/g, "");
case 3:return str.replace(/(^\s*)/g, "");
case 4:return str.replace(/(\s*$)/g, "");
default:return str;
}
}
/**
* 字母大小写切换
* @param str 要处理的字符串
* @param type 1:首字母大写 2：首页母小写 3：大小写转换 4：全部大写 5：全部小写
*/
function strChangeCase(str,type){
function ToggleCase(str) {
var itemText = ""
str.split("").forEach(
function (item) {
if (/^([a-z]+)/.test(item)) {
itemText += item.toUpperCase();
}
else if (/^([A-Z]+)/.test(item)) {
itemText += item.toLowerCase();
}
else{
itemText += item;
}
});
return itemText;
}
switch (type) {
case 1:
return str.replace(/^(\w)(\w+)/, function (v, v1, v2) {
return v1.toUpperCase() + v2.toLowerCase();
});
case 2:
return str.replace(/^(\w)(\w+)/, function (v, v1, v2) {
return v1.toLowerCase() + v2.toUpperCase();
});
case 3:
return ToggleCase(str);
case 4:
return str.toUpperCase();
case 5:
return str.toLowerCase();
default:
return str;
}
}
/**
* 字符串替换
* @param str 字符串
* @param aFindText 要替换的字符
* @param aRepText 替换成什么
*/
function replaceAll(str,aFindText,aRepText){
raRegExp = new RegExp(aFindText,"g") ;
return str.replace(raRegExp,aRepText);
}
/**
* 查找某个字符或字符串在另一个字符串中出现的次数
* @param str 字符串
* @param strSplit 要查找的字符或字符串
* @returns {Number} 返回出现的次数
*/
function countStr(str,strSplit){
return str.split(strSplit).length-1
}
/**
* 生成指定长度随机字符串
* @param len 要生成字符串的长度
*/
function RandomString(len) {
len = len || 32;
let chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678';
let maxPos = chars.length;
let pwd = '';
for (let i = 0; i < len; i++) {
pwd += chars.charAt(Math.floor(Math.random() * maxPos))
}
return pwd
}
/**
* 数组去重
* @param arr 数组
*/
function removeRepeatArray(arr) {
return Array.from(new Set(arr))
}
/**
* 数组去重针对object
* @param arr 数组
*/
function arrDelRepeatObj(arr) {
var uniques = [];
var stringify = {};
for (var i = 0; i < arr.length; i++) {
var keys = Object.keys(arr[i]);
keys.sort(function(a, b) {
return (Number(a) - Number(b));
});
var str = '';
for (var j = 0; j < keys.length; j++) {
str += JSON.stringify(keys[j]);
str += JSON.stringify(arr[i][keys[j]]);
}
if (!stringify.hasOwnProperty(str)) {
uniques.push(arr[i]);
stringify[str] = true;
}
}
uniques = uniques;
return uniques;
},
/**
* 获取数组的最大值，最小值，只针对数字类型的数组
* @param arr 数组
* @param type 0：最小值，1：最大值
*/
function compareArr(arr, type) {
if (type == 1) {
return Math.max.apply(null, arr);
} else {
return Math.min.apply(null, arr);
}
}
/**
* 得到数组的和，只针对数字类型数组
* @param arr 数组
*/
function sumArr(arr) {
var sumText = 0;
for (var i = 0, len = arr.length; i < len; i++) {
sumText += arr[i];
}
return sumText
}
/**
* 返回某个元素在数组中出现的次数
* @param arr 数组
* @param el 要查找的元素
*/
function getElCount(arr, el) {
var num = 0;
for (var i = 0, len = arr.length; i < len; i++) {
if (el == arr[i]) {
num++;
}
}
return num;
}
/**
* 检测密码强度
* @param str 字符串
* @returns 1：密码弱 2：密码中等 3：密码强 4：密码很强
*/
function checkPwd(str) {
var nowLv = 0;
if (str.length < 6) {
return nowLv
};
if (/[0-9]/.test(str)) {
nowLv++
};
if (/[a-z]/.test(str)) {
nowLv++
};
if (/[A-Z]/.test(str)) {
nowLv++
};
if (/[\.|-|_]/.test(str)) {
nowLv++
};
return nowLv;
}
/**
* 金额大写
* @param price 要转换大写的金额
*/
function digitUppercase(price) {
let fraction = ['角', '分'];
let digit = [
'零', '壹', '贰', '叁', '肆',
'伍', '陆', '柒', '捌', '玖'
];
let unit = [
['元', '万', '亿'],
['', '拾', '佰', '仟']
];
let head = price < 0 ? '欠' : '';
price = Math.abs(price);
let s = '';
for (let i = 0; i < fraction.length; i++) {
s += (digit[Math.floor(price * 10 * Math.pow(10, i)) % 10] + fraction[i]).replace(/零./, '');
}
s = s || '整';
price = Math.floor(price);
for (let i = 0; i < unit[0].length && price > 0; i++) {
let p = '';
for (var j = 0; j < unit[1].length && price > 0; j++) {
p = digit[price % 10] + unit[1][j] + p;
price = Math.floor(price / 10);
}
s = p.replace(/(零.)*零$/, '').replace(/^$/, '零') + unit[0][i] + s;
}
return head + s.replace(/(零.)*零元/, '元')
.replace(/(零.)+/g, '零')
.replace(/^整$/, '零元整');
}
/**
* 小于10 自动补零
* @param num 要补零的数字
*/
function addZero(num) {
if (parseInt(num) < 10) {
num = '0' + num
}
return num
}
/**
* 获取今日 日期
* @returns '2020-06-04'
*/
function getToDay(){
let nowDate = new Date();
let month = Number(nowDate.getMonth()) + 1;
return nowDate.getFullYear() + "-" + addZero(month) + "-" + addZero(nowDate.getDate());
}
/**
* 获取明日 日期
* @returns '2020-06-04'
*/
function getTomorrow(){
let tom = new Date()
tom.setDate(tom.getDate()+1);
let month = Number(tom.getMonth()) + 1;
return tom.getFullYear() + "-" + addZero(month) + "-" + addZero(tom.getDate());
}
/**
* 获取本周 第一天
* @returns '2020-06-04'
*/
function getWeekFirstDay(){
let nowDate = new Date();
let weekFirstDay = new Date(nowDate - (nowDate.getDay() -1 ) * 86400000);
let month = Number(weekFirstDay.getMonth()) + 1;
return weekFirstDay.getFullYear() + "-" + addZero(month) + "-" + addZero(weekFirstDay.getDate());
}
/**
* 获取本周 最后一天
* @returns '2020-06-04'
*/
function getWeekLastDay(){
let nowdate = new Date();
let weekFirstDay = new Date(nowdate - (nowdate.getDay() - 1) * 86400000);
let weekLastDay = new Date((weekFirstDay/1000 + 6*86400)*1000);
let month = Number(weekLastDay.getMonth()) + 1;
return weekLastDay.getFullYear() + "-" + addZero(month) + "-" + addZero(weekLastDay.getDate());
}
/**
* 获取本月 第一天
* @returns '2020-06-04'
*/
function getMonthFirstDay() {
let nowdate = new Date();
let monthFirstDay = new Date(nowdate.getFullYear(),nowdate.getMonth(),1);
let month =Number(monthFirstDay.getMonth()) + 1;
return monthFirstDay.getFullYear() + "-" + addZero(month) + "-" + addZero(monthFirstDay.getDate());
}
/**
* 获取本月 最后一天
* @returns '2020-06-04'
*/
function getMonthLastDay() {
let nowdate = new Date();
let monthNextFirstDay = new Date(nowdate.getFullYear(),nowdate.getMonth() + 1,1);
let monthLastDay = new Date(monthNextFirstDay - 86400000);
let month = Number(monthLastDay.getMonth()) + 1;
return monthLastDay.getFullYear() + "-" + addZero(month) + "-" + addZero(monthLastDay.getDate());
}
/**
* 判断是在手机端|平板端|PC端
* @returns 0：手机端 1：PC端 2：平板端
*/
function os(){
var ua = navigator.userAgent;
isWindowsPhone = /(?:Windows Phone)/.test(ua),
isSymbian = /(?:SymbianOS)/.test(ua) || isWindowsPhone,
isAndroid = /(?:Android)/.test(ua),
isFireFox = /(?:Firefox)/.test(ua),
isChrome = /(?:Chrome|CriOS)/.test(ua),
isTablet = /(?:iPad|PlayBook)/.test(ua) || (isAndroid && !/(?:Mobile)/.test(ua)) || (isFireFox && /(?:Tablet)/.test(ua)),
isPhone = /(?:iPhone)/.test(ua) && !isTablet,
isPc = !isPhone && !isAndroid && !isSymbian;
if (isAndroid || isPhone) {
return 0
} else if(isPc) {
return 1
} else if (isTablet) {
return 2
}
}
/**
* 获取操作系统类型
* @returns 0：Android 1：iOS
*/
function getOSType(){
if (/(Android)/i.test(navigator.userAgent)) {
return 0;
} else if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
return 1;
} else {
return 2;
}
}
/**
* 判断当前环境是否是微信环境
*/
function isWeixin(){
var ua = navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger/i) == "micromessenger") {
return true;
} else {
return false;
}
}
/**
* 绘制带有间距的文本
* @param text: 要绘制的文本
* @param x: 绘制文本的起始x坐标
* @param y: 绘制文本的起始y坐标
* @param space: 文本间距
* @param ctx: canvas对象
*/
function canvasTextSpace(text, x, y, space, ctx) {
let lineWidth = x;
for(let i = 0; i < text.length; i++){
if( i === 0) {
ctx.fillText(text[i], x, y);
}else {
lineWidth += (space + ctx.measureText(text[i-1]).width);
ctx.fillText(text[i], lineWidth, y);
}
}
}
/**
* 文本超出maxWidtth宽度，自动换行
* @param text: 要绘制的文本
* @param x: 绘制文本的起始x坐标
* @param y: 绘制文本的起始y坐标
* @param space: 文本间距
* @param ctx: canvas对象
*/
function canvasTextAutoLine(text, x, y, lineHeight, maxWidtth, ctx){
let textWidth = 0; // 文本宽度
let lastSubStrIndex= 0;
for(let i = 0; i < text.length; i++){
textWidth += ctx.measureText(text[i]).width;
if(textWidth > maxWidtth){
ctx.fillText(text.substring(lastSubStrIndex,i), x, y);
textWidth = 0;
lastSubStrIndex = i;
y += lineHeight
}
if(i === text.length - 1){
ctx.fillText(text.substring(lastSubStrIndex,text.length), x, y);
}
}
}
/**
* 文本超出maxWidtth宽度，自动换行
* @param text: 要绘制的文本
* @param x: 绘制文本的起始x坐标
* @param y: 绘制文本的起始y坐标
* @param maxWidtth: 文本最大宽度
* @param ctx: canvas对象
*/
function canvasTextEllipsis(text, x, y, maxWidtth, ctx){
let textWidth = 0; // 文本原长度
let addDotTextWidth = 0; // 如果超出 文本的显示的实际长度
let lastSubStrIndex = 0;
let dotCount = 0; // 如果文本带有... 先记录下此时的文本长度
let count = 0; // 如果文本超出 画...
let dotWidth = ctx.measureText(' ...').width; // 计算 ...的宽度
for(let i = 0; i < text.length; i++){
textWidth += ctx.measureText(text[i]).width;
if(textWidth > maxWidtth - dotWidth && !dotCount){
addDotTextWidth = textWidth - ctx.measureText(text[i]).width
lastSubStrIndex = i;
dotCount++
}
if(textWidth > maxWidtth && !count) {
count++
ctx.fillText(' ...', x + addDotTextWidth, y);
}
if(i === text.length - 1){
ctx.fillText(text.substring(0,count ? lastSubStrIndex : text.length), x, y);
}
}
}
```
扫一扫
824
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
