JavaScript常用的工具函数
1、数字操作
1.1、生成指定范围的随机数
/**
* 生成指定范围内的随机数字
* @param min
* @param max
* @returns {*}
*/
function randomNumber(min, max) {
// Math.floor() 向下取整
return Math.floor(Math.random() * (max - min + 1)) + min;
}
alert(randomNumber(10, 20));
1.2、数字千分位分隔
/**
* 数字千分位分割
* @param num
* @returns {string|*}
*/
function formatThousands(num) {
var number = num.toString();
var length = number.length;
if (length <= 3) {
return num;
}
var temp = "";
var remainder = length % 3;
if (remainder > 0) {
// 不是3的整数
return number.slice(0, remainder) + "," + number.slice(remainder, length).match(/\d{3}/g).join(",") + temp;
} else {
return number.slice(0, length).match(/\d{3}/g).join(",") + temp;
}
}
2、数组操作
2.1、数组乱序
/**
* 数组乱序
* @param arr
*/
function arrScrambling(arr) {
for (var i = 0; i < arr.length; i++) {
var randomIndex = Math.round(Math.random() * (arr.length - 1 - i)) + i;
[arr[i], arr[randomIndex]] = [arr[randomIndex], arr[i]];
}
return arr;
}
2.2、数组扁平化
/**
* 数组扁平化处理
* @param arr
* @returns {[]}
*/
function arrFlatten(arr) {
var result = [];
for (var i = 0; i < arr.length; i++) {
if (Array.isArray(arr[i])) {
result = result.concat(arrFlatten(arr[i]));
} else {
result.push(arr[i]);
}
}
return result;
}
var arr = [1, 2, 3, 4, 5, 6, [7, 8]];
alert(arrFlatten(arr)); // [1, 2, 3, 4, 5, 6, 7, 8]
2.3、数组中获取随机元素
/**
* 随机获取一个数组元素
* @param arr
* @returns {*}
*/
function sample(arr) {
return arr[Math.floor(Math.random() * arr.length)];
}
3、字符串操作
3.1、生成随机字符串
/**
* 随机生成字符串
* @param len
* @returns {string}
*/
function randomString(len) {
var chars = "ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz123456789";
var strLen = chars.length;
var randomStr = "";
for (var i = 0; i < len; i++) {
randomStr += chars.charAt(Math.floor(Math.random() * strLen));
}
return randomStr;
}
alert(randomString(10));
3.2、字符串首字母大写
/**
* 字符串首字母大写
* @param str
* @returns {string}
*/
function fistLetterUpper(str) {
return str.charAt(0).toUpperCase() + str.slice(1);
}
alert(fistLetterUpper("a111222"));
3.3、手机号中间四位变成*
/**
* 手机号中间四位变成*
* @param tel
* @returns {string}
*/
function telFormat(tel) {
tel = String(tel);
return tel.slice(0, 3) + "****" + tel.slice(7);
}
alert(telFormat(19987131174));
3.4、驼峰命名转换成短横线命名
/**
* 驼峰命名转换成短横线或下划线命名
* @param str
* @param mark
* @returns {void | string | *}
*/
function getKebabCase(str, mark) {
return str.replace(/[A-Z]/g, function (item) {
return mark + item.toLowerCase();
});
}
3.5、全角转换为半角
/**
* 全角转换为半角
* 全角：指一个字符占用两个标准字符位置
* 半角：指一个字符占用一个标准字符位置
* @param str
* @returns {string}
*/
function toCDB(str) {
var result = "";
for (var i = 0; i < str.length; i++) {
var code = str.charCodeAt(i);
if (code >= 65281 && code <= 65374) {
result += String.fromCharCode(str.charCodeAt(i) - 65248);
} else if (code == 12288) {
result += String.fromCharCode(str.charCodeAt(i) - 12288 + 32);
} else {
result += str.charAt(i);
}
}
return result;
}
3.6、半角转换为全角
/**
* 半角转换为全角
* @param str
* @returns {string}
*/
function toDBC(str) {
var result = "";
for (var i = 0; i < str.length; i++) {
var code = str.charCodeAt(i);
if (code >= 33 && code <= 126) {
result += String.fromCharCode(str.charCodeAt(i) + 65248);
} else if (code == 32) {
result += String.fromCharCode(str.charCodeAt(i) + 12288 - 32);
} else {
result += str.charAt(i);
}
}
return result;
}
alert(toDBC("abc"));
4、日期操作
4.1、把日期格式化成指定的格式字符串
/**
* 把日期格式化成指定的格式
* @param data 日期
* @param pattern 日期格式
* @returns {string}
*/
function dateFormat(date, pattern) {
if (!date instanceof Date) {
return "";
}
var map = {
"M+": date.getMonth() + 1,
"d+": date.getDate(),
"H+": date.getHours(),
"m+": date.getMinutes(),
"s+": date.getSeconds(),
"q+": Math.floor((date.getMonth() + 3) / 3),
"S": date.getMilliseconds()
};
if (/(y+)/.test(pattern)) {
pattern = pattern.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
}
for (var k in map) {
if (new RegExp("(" + k + ")").test(pattern)) {
pattern = pattern.replace(RegExp.$1, (RegExp.$1.length == 1) ? (map[k]) : (("00" + map[k]).substr(("" + map[k]).length)));
}
}
return pattern;
}
alert(dateFormat(new Date(), "yyyy-MM-dd HH:mm:ss"));
4.2、计算到期时间
/**
* 计算到期时间
* @param date 日期对象
* @param expire 期限(单位天)
* @returns {number} 时间戳
*/
function getExpireTime(date, expire) {
if (typeof date === "undefined" || date == null) {
date = new Date(); // 当前时间
}
return date.setDate(date.getDate() + expire); // 获取时间戳
}
var date = new Date();
console.log(dateFormat(date, "yyyy-MM-dd HH:mm:ss"));
console.log(dateFormat(new Date(getExpireTime(date, 10)), "yyyy-MM-dd HH:mm:ss"));
5、本地存储操作
在浏览器中，本地存储有localStorage和sessionStorage两种实现方式，他们之间的区别是：
1、localStorage的生命周期是永久的，除非在浏览器提供的UI上手动清除localStorage信息，否则永远存在。
2、sessionStorage的生命周期为当前窗口或标签页，一旦窗口或标签页被永久关闭，存储的数据也会被清空。
5.1、存储、获取、删除localStorage
/**
* 本地存储
* @param key
* @param value
*/
function setLocalStorage(key, value) {
if (!key) {
return;
}
if (typeof value !== "string") {
value = JSON.stringify(value);
}
window.localStorage.setItem(key, value);
}
setLocalStorage("person", {age: 11, name: "alex"});
/**
* 获取本地存储
* @param key
* @returns {string}
*/
function getLocalStorage(key) {
if (!key) {
return;
}
return window.localStorage.getItem(key);
}
/**
* 删除本地存储
* @param key
*/
function removeLocalStorage(key) {
if (!key) {
return;
}
window.localStorage.removeItem(key);
}
5.1、存储、获取、删除sessionStorage
/**
* session本地存储
* @param key
* @param value
*/
function setSessionStorage(key, value) {
if (!key) {
return;
}
if (typeof value !== "string") {
value = JSON.stringify(value);
}
window.sessionStorage.setItem(key, value);
}
// setSessionStorage("person", {name: "alex", age: "15"});
/**
* session本地存储获取
* @param key
* @returns {string}
*/
function getSessionStorage(key) {
if (!key) {
return;
}
return window.sessionStorage.getItem(key);
}
/**
* session本地存储删除
* @param key
*/
function removeSessionStorage(key) {
if (!key) {
return;
}
window.sessionStorage.removeItem(key);
}
6、操作cookie
6.1、新增、获取一条cookie
/**
* 设置一条Cookie
* @param key
* @param value
* @param expires 到期时间(单位天)
*/
function setCookie(key, value, expires) {
if (!key || !value) {
return;
}
var date = new Date();
date = date.setDate(date.getDate() + expires);
document.cookie = key + "=" + value + ";expires=" + new Date(date).toUTCString();
}
setCookie("name", "alex", 2); // 两天后到期
/**
* 获取指定的Cookie
* @param key
* @returns {string|null}
*/
function getCookie(key) {
var cookies = unescape(document.cookie); // cookie之间是用; 隔开的
if (!cookies) {
return null;
}
var cookieList = cookies.split("; ");
for (var i = 0; i < cookieList.length; i++) {
var cookieArr = cookieList[i].split("=");
if (cookieArr[0] === key) {
return cookieArr[1];
}
}
return null;
}
console.log(getCookie("name"));
6.2、删除Cookie
/**
* 删除指定的Cookie
* @param key
*/
function deleteCookie(key) {
if (!key) {
return;
}
document.cookie = encodeURIComponent(key) + "=;expires=" + new Date();
}
deleteCookie("name");
7、格式校验
7.1、身份证号码合法校验
/**
* 身份证号码合法校验
* @param num 身份证号码
* @returns {boolean}
*/
function checkIdCardNo(num) {
if (!num) {
return false;
}
num = num.toUpperCase(); // 身份证号码为15位或者18位，15位时全为数字，18位前17位为数字，最后一位是校验位，可能为数字或字符X。
if (!(/(^\d{15}$)|(^\d{17}([0-9]|X)$)/.test(num))) {
// alert('输入的身份证号长度不对，或者号码不符合规定！\n15位号码应全为数字，18位号码末位可以为数字或X。');
// alert('身份证号长度不正确或不符合规定！');
return false;
}
//验证前2位，城市符合
var aCity = {
11: "北京",
12: "天津",
13: "河北",
14: "山西",
15: "内蒙古",
21: "辽宁",
22: "吉林",
23: "黑龙江 ",
31: "上海",
32: "江苏",
33: "浙江",
34: "安徽",
35: "福建",
36: "江西",
37: "山东",
41: "河南",
42: "湖北",
43: "湖南",
44: "广东",
45: "广西",
46: "海南",
50: "重庆",
51: "四川",
52: "贵州",
53: "云南",
54: "西藏",
61: "陕西",
62: "甘肃",
63: "青海",
64: "宁夏",
65: "新疆",
71: "台湾",
81: "香港",
82: "澳门",
91: "国外"
};
if (aCity[parseInt(num.substr(0, 2))] == null) {
// alert('身份证号不正确或不符合规定！');
return false;
}
// 下面分别分析出生日期和校验位
var len, re;
len = num.length;
if (len == 15) {
re = new RegExp(/^(\d{6})(\d{2})(\d{2})(\d{2})(\d{3})$/);
var arrSplit = num.match(re); //检查生日日期是否正确
var dtmBirth = new Date('19' + arrSplit[2] + '/' + arrSplit[3] + '/' + arrSplit[4]);
var bGoodDay;
bGoodDay = (dtmBirth.getYear() == Number(arrSplit[2])) && ((dtmBirth.getMonth() + 1) == Number(arrSplit[3])) && (dtmBirth.getDate() == Number(arrSplit[4]));
if (!bGoodDay) {
// alert('身份证号的出生日期不对！');
return false;
} else { // 将15位身份证转成18位 //校验位按照ISO 7064:1983.MOD 11-2的规定生成，X可以认为是数字10。
var arrInt = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2);
var arrCh = new Array('1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2');
var nTemp = 0, i;
num = num.substr(0, 6) + '19' + num.substr(6, num.length - 6);
for (i = 0; i < 17; i++) {
nTemp += num.substr(i, 1) * arrInt[i];
}
num += arrCh[nTemp % 11];
return true;
}
}
if (len == 18) {
re = new RegExp(/^(\d{6})(\d{4})(\d{2})(\d{2})(\d{3})([0-9]|X)$/);
var arrSplit = num.match(re); //检查生日日期是否正确
var dtmBirth = new Date(arrSplit[2] + "/" + arrSplit[3] + "/" + arrSplit[4]);
var bGoodDay;
bGoodDay = (dtmBirth.getFullYear() == Number(arrSplit[2])) && ((dtmBirth.getMonth() + 1) == Number(arrSplit[3])) && (dtmBirth.getDate() == Number(arrSplit[4]));
if (!bGoodDay) {
// alert('身份证号的出生日期不对！');
return false;
} else { //检验18位身份证的校验码是否正确。 //校验位按照ISO 7064:1983.MOD 11-2的规定生成，X可以认为是数字10。
var valnum;
var arrInt = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2);
var arrCh = new Array('1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2');
var nTemp = 0, i;
for (i = 0; i < 17; i++) {
nTemp += num.substr(i, 1) * arrInt[i];
}
valnum = arrCh[nTemp % 11];
if (valnum != num.substr(17, 1)) {
// alert('18位身份证的校验码不正确！应该为：' + valnum);
// alert('18位身份证号的校验码不正确！');
return false;
}
return true;
}
}
return false;
}
7.2、统一社会信用代码校验
/**
* 统一社会信用代码校验
* @param code 统一社会信用代码
* @returns {boolean} true|false
*/
function checkSocialCreditCode(code) {
if (!code) {
return false;
}
var pattern = /^[0-9A-Z]+$/; // + 表示匹配 1-无穷
if (code.length != 18 || !pattern.test(code)) {
// 不是有效的统一社会信用代码
return false;
}
var anCode = ""; // 统一社会信用代码的每一个值
var codeWeight = 0; // 统一社会信用代码的每一个值的权重
var total = 0;
var weightingFactors = [1, 3, 9, 27, 19, 26, 16, 17, 20, 29, 25, 13, 8, 24, 10, 30, 28]; // 加权因子
var str = '0123456789ABCDEFGHJKLMNPQRTUWXY';
// 不用I、O、S、V、Z
for (var i = 0; i < code.length - 1; i++) {
anCode = code.substring(i, i + 1);
codeWeight = str.indexOf(anCode);
// 计算权重与加权因子相乘之和
total = total + codeWeight * weightingFactors[i];
}
var logicCheckCode = 31 - total % 31;
if (logicCheckCode == 31) {
logicCheckCode = 0;
}
var item = "0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F,G,H,J,K,L,M,N,P,Q,R,T,U,W,X,Y";
var itemArray = item.split(",");
logicCheckCode = itemArray[logicCheckCode];
var checkCode = code.substring(17, 18);
if (checkCode != logicCheckCode) {
return false;
}
return true;
}
console.log(checkSocialCreditCode("913100007033013011"));
7.3、是否包含中文判断
/**
* 是否包含中文判断
* @param value 一段字符串
* @returns {boolean}
*/
function haveCNChars(value) {
return /[\u4e00-\u9fa5]/.test(value);
}
console.log(haveCNChars(123)); // false
console.log(haveCNChars("你好123")); // true
7.4、是否为IPv6地址
/**
* 是否为isIPv6地址
* @param str
* @returns {boolean}
*/
function isIPv6(str) {
return Boolean(str.match(/:/g)?str.match(/:/g).length<=7:false && /::/.test(str)?/^([\da-f]{1,4}(:|::)){1,6}[\da-f]{1,4}$/i.test(str):/^([\da-f]{1,4}:){7}[\da-f]{1,4}$/i.test(str));
}
7.5、是否为正确邮箱地址
/**
* 是否为正确邮箱地址
* @param value
* @returns {boolean}
*/
function isEmail(value) {
return /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(value);
}
console.log(isEmail("3299447929@qq.com"));
console.log(isEmail("lai@icloud.com"));
7.6、是否为中国大陆手机号
/**
* 验证是否为中国大陆手机号码
* @param number 手机号码
* @returns {boolean}
*/
function checkTelephoneNumber(number) {
if (!number) {
return false;
}
return /^1[3,4,5,6,7,8,9][0-9]{9}$/.test(number.toString());
}
console.log(checkTelephoneNumber("19987131172")); // true
8、URL操作
8.1、获取URL参数列表
/**
* 获取URL查询参数
* @param url URL地址
* @returns {{}}
*/
function getRequestParam(url) {
if (!url || url == null || typeof url == "undefined") {
url = location.search;
}
// 1.截取 ? 后面的字符串
var paramStr = /.+\?(.+)$/.exec(url)[1];
// 2.使用 & 分割后存储数组中
var paramList = paramStr.split("&");
var param = {};
for (var i = 0; i < paramList.length; i++) {
var item = paramList[i];
if (/=/.test(item)) {
var [name, value] = item.split("=");
// 解码
value = decodeURIComponent(value);
value = /^\d+$/.test(value) ? parseFloat(value) : value;
if (param.hasOwnProperty(name)) {
param[name] = [].concat(param[name], value);
} else {
param[name] = value;
}
} else {
param[item] = true; // 处理没有 value 的参数(给一个默认值true)
}
}
return param;
}
var param = getRequestParam("https://editor.csdn.net/md/?articleId=124081727");
for (var i in param) {
console.log(i + "=" + param[i]);
}
8.2、对象拼接成URL参数
/**
* 对象转url请求参数
* @param param
* @returns {string|null}
*/
function convertToUrl(param) {
if (!param) {
return null;
}
var paramList = [];
for (var key in param) {
paramList.push(key + "=" + param[key]);
}
return "?" + paramList.join("&");
}
var p = {
name: "a",
age: 2
};
console.log(convertToUrl(p));
8.3、修改URL中的参数
/**
* 修改URL中的参数
* @param param
* @param replace
* @returns {string}
*/
function replaceParam(url, param, replace) {
if (!url) {
return null;
}
// var url = window.location.href.toString();
var re = eval("/(" + param + "=)([^&]*)/gi"); // eval() 将字符串解析js代码并运行
// window.location.href = url.replace(re, param + "=" + replace);
return url.replace(re, param + "=" + replace);
}
9、设备判断
9.1、判断是移动还是PC
/**
* 移动|PC设备判断
* @returns {string}
*/
function getClientDesktopType() {
console.log(navigator.userAgent);
if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iOS|iPad|Backerry|WebOS|Symbian|Windows Phone|Phone)/i))) {
return 'mobile';
}
return 'desktop';
}
console.log(getClientDesktopType());
9.2、判断是苹果还是安卓移动设备
/**
* 判断苹果还是安卓移动设备
* @returns {boolean}
*/
function isAppleMobileDevice() {
let reg = /iphone|ipod|ipad|Macintosh/i;
return reg.test(navigator.userAgent.toLowerCase());
}
console.log(isAppleMobileDevice()); // false
9.3、判断是Windows还是Mac系统
/**
* 判断是windows还是mac系统
* @returns {string}
*/
function getOsType() {
var agent = navigator.userAgent.toLowerCase();
var isMac = /macintosh|mac os x/i.test(agent); // i 不区分大小写匹配
var isWindows = agent.indexOf("win64") >= 0 || agent.indexOf("wow64") >= 0 || agent.indexOf("win32") >= 0 || agent.indexOf("wow32") >= 0;
if (isMac) {
return "mac";
}
if (isWindows) {
return "windows";
}
}
console.log(getOsType()); // windows
9.4、获取浏览器型号和版本
/**
* 获取浏览器型号及版本信息
* @returns {{type: string, version: number}}
*/
function getCurrentBrowserInfo() {
var agent = navigator.userAgent.toLowerCase();
if (agent.indexOf("msie") >= 0) {
// ie < 11
return {type: "IE", version: Number(agent.match(/msie ([\d]+)/)[1])};
}
if (agent.match(/trident\/.+?rv:(([\d.]+))/)) {
// ie 11
return {type: "IE", version: 11};
}
if (agent.indexOf("edge") >= 0) {
return {type: "Edge", version: Number(agent.match(/edge\/([\d]+)/)[1])};
}
if (agent.indexOf("firefox") >= 0) {
return {type: "Firefox", version: Number(agent.match(/firefox\/([\d]+)/)[1])};
}
if (agent.indexOf("chrome") >= 0) {
return {type: "Chrome", version: Number(agent.match(/chrome\/([\d]+)/)[1])};
}
if (agent.indexOf("opera") >= 0) {
return {type: "Opera", version: Number(agent.match(/opera.([\d]+)/)[1])};
}
if (agent.indexOf("Safari") >= 0) {
return {type: "Safari", version: Number(agent.match(/version\/([\d]+)/)[1])};
}
return {type: agent, version: -1};
}
console.log(getCurrentBrowserInfo()); // {type: 'Chrome', version: 99}
155
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
