回归 | js实用代码片段的封装与总结(持续更新中...)
上一次更博还是去年10月28号了,截至今天已经有整整4个月没有更新博客了,没更新博客不是代表不学了,期间我已经用vue做了两个项目,微信小程序做了一个项目,只是毕竟找到工作了,想偷偷懒,你懂的。
过年期间一直在关注js片段代码,虽然这个时代前端框架横行,大量上层工具层出不穷,比如http请求的封装:react的fetch、vue的axios(vue官方已经不用vue-resource了);知名的lodash,和最近发现的30-seconds-of-code,在我看来这些都是宝贝。言归正传,今天主要是基于想整理js代码片段的想法,于是就写以篇博客总结总结,毕竟拿来主义在开发过程中还是挺重要的。以后想用直接就用,不用再想和找,加快开发效率。
引用
area.js文件是给身份证号号对应的信息
注:Jen是我封装好的对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<script type="text/javascript" src="./area.js"></script>
<script type="text/javascript" src="./Jen.js"></script>
<body>
</body>
</html>
area.js
注:area.js很长,我就贴上部分代码
//区域
(function() {
var JEN_AREAS= {
110000: '北京市',
110100: '市辖区',
110101: '东城区',
110102: '西城区',
110103: '崇文区',
110104: '宣武区',
110105: '朝阳区',
110106: '丰台区',
110107: '石景山区',
110108: '海淀区',
110109: '门头沟区',
110111: '房山区',
110112: '通州区',
110113: '顺义区',
110114: '昌平区',
110115: '大兴区',
110116: '怀柔区',
110117: '平谷区',
110200: '市辖县',
110228: '密云县',
110229: '延庆县',
120000: '天津市',
120100: '市辖区',
120101: '和平区',
120102: '河东区',
120103: '河西区',
120104: '南开区',
120105: '河北区',
120106: '红桥区',
...
Jen.js
/**
* 常用工具类
* Author:hejian
* Date:2018-3-1
*/ (function() {
var Jen = Jen || {};
Jen.areas = window.JEN_AREAS || {}
// 判断类型
Jen.TypeJudge = {
isString: function(o) { //是否为字符串
return Object.prototype.toString.call(o).slice(8, -1) === "String"
},
isNumber: function(o) { //是否为数字
return Object.prototype.toString.call(o).slice(8, -1) === "Number"
},
isObj: function(o) { //是否为对象
return Object.prototype.toString.call(o).slice(8, -1) === "Object"
},
isArray(o) { //是否数组
return Object.prototype.toString.call(o).slice(8, -1) === 'Array'
},
isDate(o) { //是否时间
return Object.prototype.toString.call(o).slice(8, -1) === 'Date'
},
isBoolean(o) { //是否boolean
return Object.prototype.toString.call(o).slice(8, -1) === 'Boolean'
},
isFunction(o) { //是否函数
return Object.prototype.toString.call(o).slice(8, -1) === 'Function'
},
isNull(o) { //是否为null
return Object.prototype.toString.call(o).slice(8, -1) === 'Null'
},
isUndefined(o) { //是否undefined
return Object.prototype.toString.call(o).slice(8, -1) === 'Undefined'
},
isFalse(o) {
if (!o || o === 'null' || o === 'undefined' || o === 'false' || o === 'NaN')
return true
},
isTrue(o) {
return !this.isFalse(o)
}
}
// 判断浏览器类型
Jen.browserType = function() {
var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
var isOpera = userAgent.indexOf("Opera") > -1; //判断是否Opera浏览器
var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera; //判断是否IE浏览器
var isEdge = userAgent.indexOf("Edge") > -1; //判断是否IE的Edge浏览器
var isFF = userAgent.indexOf("Firefox") > -1; //判断是否Firefox浏览器
var isSafari = userAgent.indexOf("Safari") > -1 && userAgent.indexOf('Chrome') == -1 //判断是否Safari浏览器
var isChrome = userAgent.indexOf("CriOS") > -1 && userAgent.indexOf('Safari') > -1 //判断Chrome浏览器
if (isIE) {
var reIE = new RegExp("MSIE (\\d+\\.\\d+);");
reIE.test(userAgent);
var fIEVersion = parseFloat(RegExp["$1"]);
if (fIEVersion == 7)
return "IE7"
else if (fIEVersion == 8)
return "IE8";
else if (fIEVersion == 9)
return "IE9";
else if (fIEVersion == 10)
return "IE10";
else if (fIEVersion == 11)
return "IE11";
else
return "IE7以下" //IE版本过低
} if (isFF)
return "FF";
if (isOpera)
return "Opera";
if (isEdge)
return "Edge";
if (isChrome)
return "Chrome";
if (isSafari)
return "Safari";
}
// 判断字符串类型
Jen.checkStr = function(str, type) {
switch (type) {
case 'phone': //手机号码
return /^1[3|4|5|7|8][0-9]{9}$/.test(str);
case 'tel': //座机
return /^(0\d{2,3}-\d{7,8})(-\d{1,4})?$/.test(str);
case 'card': //身份证
return /^\d{15}|\d{18}$/.test(str);
case 'pwd': //密码以字母开头,长度在6~18之间,只能包含字母、数字和下划线
return /^[a-zA-Z]\w{5,17}$/.test(str)
case 'postal': //邮政编码
return /[1-9]\d{5}(?!\d)/.test(str);
case 'QQ': //QQ号
return /^[1-9][0-9]{4,9}$/.test(str);
case 'email': //邮箱
return /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/.test(str);
case 'money': //金额(小数点2位)
return /^\d*(?:\.\d{0,2})?$/.test(str);
case 'URL': //网址
return /(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?/.test(str)
case 'IP': //IP
return /((?:(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d)\\.){3}(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d))/.test(str);
case 'date': //日期时间
return /^(\d{4})\-(\d{2})\-(\d{2}) (\d{2})(?:\:\d{2}|:(\d{2}):(\d{2}))$/.test(str) || /^(\d{4})\-(\d{2})\-(\d{2})$/.test(str)
case 'number': //数字
return /^[0-9]$/.test(str);
case 'english': //英文
return /^[a-zA-Z]+$/.test(str);
case 'chinese': //中文
return /^[\u4E00-\u9FA5]+$/.test(str);
case 'lower': //小写
return /^[a-z]+$/.test(str);
case 'upper': //大写
return /^[A-Z]+$/.test(str);
case 'HTML': //HTML标记
return /<("[^"]*"|'[^']*'|[^'">])*>/.test(str);
default:
return true;
}
}
//格式化时间
Jen.formatTime = function(format) {
var newDate = new Date();
var date = {
"M+": newDate.getMonth() + 1,
"d+": newDate.getDate(),
"h+": newDate.getHours(),
"m+": newDate.getMinutes(),
"s+": newDate.getSeconds(),
"q+": Math.floor((newDate.getMonth() + 3) / 3),
"S+": newDate.getMilliseconds()
};
if (/(y+)/i.test(format)) {
format = format.replace(RegExp.$1, (newDate.getFullYear() + '').substr(4 - RegExp.$1.length));
}
for (var k in date) {
if (new RegExp("(" + k + ")").test(format)) {
format = format.replace(RegExp.$1, RegExp.$1.length == 1
? date[k]
: ("00" + date[k]).substr(("" + date[k]).length));
}
}
return format;
}
// 判断一个元素是否在数组中
Jen.contains = function(arr, val) {
return arr.indexOf(val) != -1
? true
: false
}
/*
* 字符串去除空格
* @param {str}
* @param {type}
* type: 1-所有空格 2-前后空格 3-前空格 4-后空格
* @return {String}
*/
Jen.trim = function(str, type) {
type = type || 1
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}
*type: 1:首字母大写 2:首页母小写 3:大小写转换 4:全部大写 5:全部小写
* @return {String}
*/
Jen.changeCase = function(str, type) {
type = type || 4
switch (type) {
case 1:
return str.replace(/\b\w+\b/g, function(word) {
return word.substring(0, 1).toUpperCase() + word.substring(1).toLowerCase();
});
case 2:
return str.replace(/\b\w+\b/g, function(word) {
return word.substring(0, 1).toLowerCase() + word.substring(1).toUpperCase();
});
case 3:
return str.split('').map(function(word) {
if (/[a-z]/.test(word)) {
return word.toUpperCase();
} else {
return word.toLowerCase()
}
}).join('')
case 4:
return str.toUpperCase();
case 5:
return str.toLowerCase();
default:
return str;
}
}
// 有范围的随机数
Jen.random = function(min, max) {
if (arguments.length === 2) {
return Math.floor(min + Math.random() * ((max + 1) - min))
} else {
return null;
}
}
// 将阿拉伯数字翻译成中文的大写数字
Jen.numToChNum=function(num){
var AA = new Array("零", "一", "二", "三", "四", "五", "六", "七", "八", "九", "十");
var BB = new Array("", "十", "百", "仟", "萬", "億", "点", "");
var a = ("" + num).replace(/(^0*)/g, "").split("."),
k = 0,
re = "";
for(var i = a[0].length - 1; i >= 0; i--) {
switch(k) {
case 0:
re = BB[7] + re;
break;
case 4:
if(!new RegExp("0{4}//d{" + (a[0].length - i - 1) + "}$")
.test(a[0]))
re = BB[4] + re;
break;
case 8:
re = BB[5] + re;
BB[7] = BB[5];
k = 0;
break;
}
if(k % 4 == 2 && a[0].charAt(i + 2) != 0 && a[0].charAt(i + 1) == 0)
re = AA[0] + re;
if(a[0].charAt(i) != 0)
re = AA[a[0].charAt(i)] + BB[k % 4] + re;
k++;
}
if(a.length > 1) // 加上小数部分(如果有小数部分)
{
re += BB[6];
for(var i = 0; i < a[1].length; i++)
re += AA[a[1].charAt(i)];
}
if(re == '一十')
re = "十";
if(re.match(/^一/) && re.length == 3)
re = re.replace("一", "");
return re;
}
// 将数字转成大写金额
Jen.numToMoneyWord=function(Num) {
Num = ~~Num;
//判断如果传递进来的不是字符的话转换为字符
if (typeof Num == "number") {
Num = new String(Num);
}; Num = Num.replace(/,/g, "") //替换tomoney()中的“,”
Num = Num.replace(/ /g, "") //替换tomoney()中的空格
Num = Num.replace(/¥/g, "") //替换掉可能出现的¥字符
if (isNaN(Num)) { //验证输入的字符是否为数字
//alert("请检查小写金额是否正确");
return "";
};
// console.log(Num);
//字符处理完毕后开始转换,采用前后两部分分别转换
var part = String(Num).split(".");
var newchar = "";
//小数点前进行转化
for (var i = part[0].length - 1; i >= 0; i--) {
if (part[0].length > 10) {
return "";
//若数量超过拾亿单位,提示
}
var tmpnewchar = ""
var perchar = part[0].charAt(i);
switch (perchar) {
case "0":
tmpnewchar = "零" + tmpnewchar;
break;
case "1":
tmpnewchar = "壹" + tmpnewchar;
break;
case "2":
tmpnewchar = "贰" + tmpnewchar;
break;
case "3":
tmpnewchar = "叁" + tmpnewchar;
break;
case "4":
tmpnewchar = "肆" + tmpnewchar;
break;
case "5":
tmpnewchar = "伍" + tmpnewchar;
break;
case "6":
tmpnewchar = "陆" + tmpnewchar;
break;
case "7":
tmpnewchar = "柒" + tmpnewchar;
break;
case "8":
tmpnewchar = "捌" + tmpnewchar;
break;
case "9":
tmpnewchar = "玖" + tmpnewchar;
break;
}
switch (part[0].length - i - 1) {
case 0:
tmpnewchar = tmpnewchar + "元";
break;
case 1:
if (perchar != 0)
tmpnewchar = tmpnewchar + "拾";
break;
case 2:
if (perchar != 0)
tmpnewchar = tmpnewchar + "佰";
break;
case 3:
if (perchar != 0)
tmpnewchar = tmpnewchar + "仟";
break;
case 4:
tmpnewchar = tmpnewchar + "万";
break;
case 5:
if (perchar != 0)
tmpnewchar = tmpnewchar + "拾";
break;
case 6:
if (perchar != 0)
tmpnewchar = tmpnewchar + "佰";
break;
case 7:
if (perchar != 0)
tmpnewchar = tmpnewchar + "仟";
break;
case 8:
tmpnewchar = tmpnewchar + "亿";
break;
case 9:
tmpnewchar = tmpnewchar + "拾";
break;
}
var newchar = tmpnewchar + newchar;
}
//小数点之后进行转化
if(Num.indexOf(".") != -1) {
if(part[1].length > 2) {
// alert("小数点之后只能保留两位,系统将自动截断");
part[1] = part[1].substr(0, 2)
}
for(i = 0; i < part[1].length; i++) {
tmpnewchar = ""
perchar = part[1].charAt(i)
switch(perchar) {
case "0":
tmpnewchar = "零" + tmpnewchar;
break;
case "1":
tmpnewchar = "壹" + tmpnewchar;
break;
case "2":
tmpnewchar = "贰" + tmpnewchar;
break;
case "3":
tmpnewchar = "叁" + tmpnewchar;
break;
case "4":
tmpnewchar = "肆" + tmpnewchar;
break;
case "5":
tmpnewchar = "伍" + tmpnewchar;
break;
case "6":
tmpnewchar = "陆" + tmpnewchar;
break;
case "7":
tmpnewchar = "柒" + tmpnewchar;
break;
case "8":
tmpnewchar = "捌" + tmpnewchar;
break;
case "9":
tmpnewchar = "玖" + tmpnewchar;
break;
}
if(i == 0) tmpnewchar = tmpnewchar + "角";
if(i == 1) tmpnewchar = tmpnewchar + "分";
newchar = newchar + tmpnewchar;
}
}
//替换所有无用汉字
while(newchar.search("零零") != -1)
newchar = newchar.replace("零零", "零");
newchar = newchar.replace("零亿", "亿");
newchar = newchar.replace("亿万", "亿");
newchar = newchar.replace("零万", "万");
newchar = newchar.replace("零元", "元");
newchar = newchar.replace("零角", "");
newchar = newchar.replace("零分", "");
if(newchar.charAt(newchar.length - 1) == "元") {
newchar = newchar + "整"
}
return newchar;
}
// 模拟getElement...
Jen.getElement =function(selector){
var type = selector.substring(0, 1);
if (type === '#') {
if (document.querySelecotor) return document.querySelector(selector)
return document.getElementById(selector.substring(1))
}else if (type === '.') {
if (document.querySelecotorAll) return document.querySelectorAll(selector)
return document.getElementsByClassName(selector.substring(1))
}else{
return document['querySelectorAll' ? 'querySelectorAll':'getElementsByTagName'](selector)
}
}
// 检测类名
Jen.hasClass =function(ele,name){
return ele.className.match(new RegExp('(\\s|^)' + name + '(\\s|$)'));
}
// 添加类名
Jen.addClass =function(ele,name){
if (!this.hasClass(ele, name)) ele.className += " " + name;
}
// 删除类名
Jen.removeClass = function(ele,name){
if (this.hasClass(ele, name)) {
var reg = new RegExp('(\\s|^)' + name + '(\\s|$)');
ele.className = ele.className.replace(reg, '');
}
}
// 替换类名
Jen.replaceClass =function(ele, newName, oldName) { this.removeClass(ele, oldName); this.addClass(ele, newName); }
// 获取兄弟节点
Jen.siblings =function(ele) {
// console.log(ele.parentNode)
var chid = ele.parentNode.children,eleMatch = [];
for(var i = 0, len = chid.length; i < len; i ++){
if(chid[i] != ele){
eleMatch.push(chid[i]);
}
}
return eleMatch;
}
// 获取行内样式
Jen.getByStyle =function(obj,name){ if(obj.currentStyle){ return obj.currentStyle[name]; }else{ return getComputedStyle(obj,false)[name]; }
}
// 设置cookie chrome本地无法设置cookie
Jen.setCookie = function(name, value, day) {
var setting = arguments[0];
if (Object.prototype.toString.call(setting).slice(8, -1) === 'Object') { for (var i in setting) {
var oDate = new Date();
oDate.setDate(oDate.getTime() + day * 24 * 60 * 60 * 1000);
document.cookie = i + '=' + setting[i] + ';expires=' + oDate;
}
} else {
var oDate = new Date();
oDate.setDate(oDate.getTime() + day * 24 * 60 * 60 * 1000);
console.log()
document.cookie = name + '=' + value + ';expires=' + oDate;
}
}
// 获取cookie
Jen.getCookie=function(name) {
var arr = document.cookie.split('; ');
for (var i = 0; i < arr.length; i++) {
var arr2 = arr[i].split('=');
if (arr2[0] == name) {
return arr2[1];
}
}
return '';
}
// 删除cookie
Jen.removeCookie =function(name) {
this.setCookie(name, '', -1);
}
// 设置localStorage
// var _this = this
var ls = window.localStorage
Jen.setLocal=function(key, val) {
var setting = arguments[0];
if (Object.prototype.toString.call(setting).slice(8, -1) === 'Object') {
for (var i in setting) {
ls.setItem(i, JSON.stringify(setting[i]))
}
} else {
ls.setItem(key, JSON.stringify(val))
}
}
// 获取localStorage
Jen.getLocal=function(key) {
if (key)
return JSON.parse(ls.getItem(key))
return null;
}
// 移除localStorage
Jen.removeLocal=function(key) {
ls.removeItem(key)
}
// 移除所有localStorage
Jen.clearAllLocal=function() {
ls.clear()
}
// 获取网址参数
Jen.getURL = function(url) {
var result = {};
var reg = new RegExp('([\\?|&])(.+?)=([^&?]*)', 'ig');
var arr = reg.exec(url);
while (arr) {
result[arr[2]] = arr[3];
arr = reg.exec(url);
}
return result;
}
// 删除url指定参数,返回url
Jen.delParamsUrl=function(url, key){
var baseUrl = url.split('?')[0] + '?';
var query = url.split('?')[1];
if (query.indexOf(key)>-1) {
var obj = {}
var arr = query.split("&");
for (var i = 0; i < arr.length; i++) {
arr[i] = arr[i].split("=");
obj[arr[i][0]] = arr[i][1];
};
delete obj[key];
var url = baseUrl + JSON.stringify(obj).replace(/[\"\{\}]/g,"").replace(/\:/g,"=").replace(/\,/g,"&");
return url
}else{
return url;
}
}
// 获取16进制随机色
Jen.getRandomColor =function() {
return '#' + (function(h) {
return new Array(7 - h.length).join("0") + h;
})((Math.random() * 0x1000000 << 0).toString(16));
}
// 懒加载
// 显示加载image对象,滚动监听,图片出现在视窗赋予其真实地址,实现缓慢加载img8
Jen.lazyLoad = function(){
var bodyScrollHeight = document.body.scrollTop; // body滚动高度
var windowHeight = window.innerHeight; // 视窗高度
var imgs = document.getElementsByClassName('my-photo');
for (var i = 0; i < imgs.length; i++) {
var imgHeight = imgs[i].offsetTop; // 图片距离顶部高度
if (imgHeight < windowHeight + bodyScrollHeight) {
imgs[i].src = imgs[i].getAttribute('data-src');
// imgs[i].className = imgs[i].className.replace('my-photo', '')
}
}
}
// 判断电话的运营商类型
Jen.PhoneUtils = {
phoneRegexs :{
//中国电信号码段
CHINA_TELECOM_PATTERN: /^(?:\+86)?1(?:33|53|7[37]|8[019])\d{8}$|^(?:\+86)?1700\d{7}$/,
//中国联通号码段
CHINA_UNICOM_PATTERN: /^(?:\+86)?1(?:3[0-2]|4[5]|5[56]|7[56]|8[56])\d{8}$|^(?:\+86)?170[7-9]\d{7}$/,
//中国移动号码段
CHINA_MOBILE_PATTERN: /^(?:\+86)?1(?:3[4-9]|4[7]|5[0-27-9]|7[8]|8[2-478])\d{8}$|^(?:\+86)?1705\d{7}$/,
//电话座机号码段
PHONE_CALL_PATTERN: /^(?:\(\d{3,4}\)|\d{3,4}-)?\d{7,8}(?:-\d{1,4})?$/,
//手机号码
PHONE_PATTERN: /^(?:\+86)?(?:13\d|14[57]|15[0-35-9]|17[35-8]|18\d)\d{8}$|^(?:\+86)?170[057-9]\d{7}$/,
//手机号简单校验,不根据运营商分类
PHONE_SIMPLE_PATTERN: /^(?:\+86)?1\d{10}$/
},
//电话座机号码段
isPhoneCallNum: function(input) {
return this.phoneRegexs.PHONE_CALL_PATTERN.test(input);
},
//中国电信号码段
isChinaTelecomPhoneNum: function(input) {
return this.phoneRegexs.CHINA_TELECOM_PATTERN.test(input);
},
//中国联通号码段
isChinaUnicomPhoneNum: function(input) {
return this.phoneRegexs.CHINA_UNICOM_PATTERN.test(input);
},
//中国移动号码段
isChinaMobilePhoneNum: function(input) {
return this.phoneRegexs.CHINA_MOBILE_PATTERN.test(input);
},
//手机号码
isPhoneNum: function(input) {
return this.phoneRegexs.PHONE_PATTERN.test(input);
},
//手机号简单校验,不根据运营商分类
isPhoneNumBySize: function(input) {
return this.phoneRegexs.PHONE_SIMPLE_PATTERN.test(input);
}
}
//校验身份证与获取身份证信息
Jen.IdCardUtils = {
idCardRegex: {
//18位身份证简单校验
IDCARD_18_SIMPLE_PATTERN: /^(?:1[1-5]|2[1-3]|3[1-7]|4[1-6]|5[0-4]|6[1-5])\d{4}(?:1[89]|20)\d{2}(?:0[1-9]|1[0-2])(?:0[1-9]|[12]\d|3[01])\d{3}(?:\d|[xX])$/,
//15位身份证简单校验
IDCARD_15_SIMPLE_PATTERN: /^(?:1[1-5]|2[1-3]|3[1-7]|4[1-6]|5[0-4]|6[1-5])\d{4}\d{2}(?:0[1-9]|1[0-2])(?:0[1-9]|[12]\d|3[01])\d{3}$/
},
//18位身份证简单校验
isSimpleIdCard18: function(idCard) {
return this.idCardRegex.IDCARD_18_SIMPLE_PATTERN.test(idCard);
},
//15位身份证简单校验
isSimpleIdCard15: function(idCard) {
return this.idCardRegex.IDCARD_18_SIMPLE_PATTERN.test(idCard);
},
//18位身份证校验码校验
checkCode: function(idCard) {
var multiplier = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
var idDatas = idCard.split("");
var len = 17;
var sum = 0;
for(var i = 0; i < len; i++) {
sum += idDatas[i] * multiplier[i];
}
var remainder = sum % 11;
var checkCodeArr = ['1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2'];
var checkCode = checkCodeArr[remainder];
return checkCode === idCard[17];
},
//18位身份证严格校验
isIdCard18: function(idCard) {
//先校验格式
if(this.isSimpleIdCard18(idCard)) {
//校验日期时间是否合法
var dateStr = idCard.substr(6, 8);
var dateStrNew = dateStr.replace(/(\d{4})(\d{2})(\d{2})/, "$1/$2/$3");
var dateObj = new Date(dateStrNew);
var month = dateObj.getMonth() + 1;
if(parseInt(dateStr.substr(4, 2)) === month) {
return this.checkCode(idCard);
}
}
return false;
},
//根据18身份证号码获取人员信息
getPersonInfo18:function(idCard){
var age=0;
var birthday='';
var address='';
var sex='';
address=Jen.areas[idCard.substr(0,2)+'0000']+' '+Jen.areas[idCard.substr(0,4)+'00']+' '+Jen.areas[idCard.substr(0,6)];
sex=(idCard.substr(16,1)%2===0)?'女':'男';
birthday=idCard.substr(6,8).replace(/(\d{4})(\d{2})(\d{2})/,'$1年$2月$3日');
age=new Date().getFullYear()-idCard.substr(6,4);
var person={'address':address,'sex':sex,'birthday':birthday,'age':age};
return person;
}
};
window['Jen'] = Jen
})()
使用
1. 判断字符串类型
let TypeJudge = Jen.TypeJudge;
console.log(TypeJudge.isString(str)); // 是否是字符串
console.log(TypeJudge.isNumber(str)); // 是否是数字
console.log(TypeJudge.isObj(str)); // 是否是对象
console.log(TypeJudge.isArray(str)); // 是否是数组
console.log(TypeJudge.isDate(str)); // 是否是时间对象
console.log(TypeJudge.isBoolean(str)); // 是否是布尔值
console.log(TypeJudge.isFunction(str)); // 是否是函数
console.log(TypeJudge.isNull(str)); // 是否为空
console.log(TypeJudge.isUndefined(str)); // 是否未定义
console.log(TypeJudge.isFalse(str)); // 是否为false
console.log(TypeJudge.isTrue(str)); // 是否为true
2. 判断浏览器类型
console.log(Jen.browserType())
3.判断字符串的含义
/*
* @number number
* @type 可以是 phone, tel ,card, pwd, postal, QQ ,email, money, URL, IP, date ,number, english, chinese ,lower ,upper, HTML
*/
console.log(Jen.checkStr(number,type))
//console.log( Jen.checkStr('15829050465','phone'))
4.格式化时间.
console.log( Jen.formatTime('yyyy-MM-dd h:m:s'))
5.判断元素是否在数组中
console.log( Jen.contains([1,2,3,4],1));
6.去除空格
/*
* 字符串去除空格
* @str string
* @type number
* type: 1-所有空格 2-前后空格 3-前空格 4-后空格
* @return {String}
*/
console.log( Jen.trim(str,type));
7.大小写转换
/*
* @str string
* @type number
*type: 1:首字母大写 2:首页母小写 3:大小写转换 4:全部大写 5:全部小写
* @return {String}
*/
console.log( Jen.changeCase(str,type));
8.有范围的随机数
console.log( Jen.random(min,max));
9.将阿拉伯数字翻译成中文的大写数字
console.log( Jen.numToChNum(number));
10.将数字转成大写金额
注:string必须是数字字符串
console.log( Jen.numToMoneyWord(string));
11.模拟getElement...
/*
* @element 获取到的DOM节点
* @className 类名
* @newClasName 新类名
* @oldClassName 旧类名
* @attr 属性
*/
Jen.getElement(.className);
// 添加class
Jen.addClass(element,className)
// 移除class
Jen.removeClass(element,className);
// 用newClassName代替oldClassName
Jen.replaceClass (element, newClassName, oldClassName);
// 获取兄弟节点
console.log(Jen.siblings(element));
// 获取元素行内样式(rgba)
console.log(Jen.getByStyle(element,attr));
12.cookie相关
注:chrome不允许本地设置cookie,故需要放在服务器上
/*
* @key object/string
* @value string
* @day hours
*/
// 设置
Jen.setCookie(key,value,day)
// 获取
console.log(Jen.getCookie(key))
// 移除
Jen.removeCookie('key');
13.localStorage
/*
* @key object/string
* @value string
*/
// 设置localStorage
Jen.setLocal(key,value);
// 移除localStorage
Jen.removeLocal(key);
14.预加载
注:先加载image对象,滚动监听,图片出现在视窗赋予其真实地址,实现缓慢加载img
Jen.lazyLoad()
15.获取16进制随机色
Jen.getRandomColor()
16.获取url的get参数并以对象形式返回
console.log(Jen.getURL('http://www.baidu.com?name=sdf&age=12&cit'))
17.删除url的get参数并返回删除后的url
console.log(Jen.delParamsUrl('http://www.baidu.com?name=sdf&age=12&cit','name'))
18.判断电话类型返回布尔值
/*
中国电信号码段 isChinaTelecomPhoneNum
中国联通号码段 isChinaUnicomPhoneNum
中国移动号码段 isChinaMobilePhoneNum
电话座机号码段 isPhoneCallNum
手机号码 isPhoneNum
手机号简单校验,不根据运营商分类 isPhoneNumBySize
*/
console.log(Jen.PhoneUtils.isChinaMobilePhoneNum(1582905xxxx))
19.校验身份证与获取身份证信息,以对象形式返回
/*
@ IDCard 字符串类型的数字
*/
console.log(Jen.IdCardUtils.getPersonInfo18(IDCard))
// console.log(Jen.IdCardUtils.getPersonInfo18('61012519960412xxxx'))
注:返回的信息
回归 | js实用代码片段的封装与总结(持续更新中...)的更多相关文章
- 【前端】Util.js-ES6实现的常用100多个javaScript简短函数封装合集(持续更新中)
Util.js (持续更新中...) 项目地址: https://github.com/dragonir/Util.js 项目描述 Util.js 是对常用函数的封装,方便在实际项目中使用,主要内容包 ...
- 知道创宇爬虫题--代码持续更新中 - littlethunder的专栏 - 博客频道 - CSDN.NET
知道创宇爬虫题--代码持续更新中 - littlethunder的专栏 - 博客频道 - CSDN.NET undefined 公司介绍 - 数人科技 undefined
- js坑爹笔试题目汇总(持续更新中)
把你的面试官问倒,你就是一个合格的面试者了,以下总结一些易错的js笔试题目,会持续更新中.欢迎关注 1,考察this var length = 10 function fn(){ alert(this ...
- 前端深入之js篇丨Array数组操作从入门到成神Up Up Up,持续更新中
写在前面 随着前端深入的不断学习,发现数组这个数据结构在前端中有着相当大的存在感,由于我初学前端的时候并没有系统性的学习数组,所以我将通过这篇文章同你一起学习数组,希望我们能一起进步,学会熟练操作数组 ...
- vue项目常用方法封装,持续更新中。。。
vue项目中可以直接使用 1.常用工具类untils.js中 /* * 验证手机号是否合格 * true--说明合格 */ export function isPhone(phoneStr){ let ...
- PHP实用代码片段(三)
1. 目录清单 使用下面的 PHP 代码片段可以在一个目录中列出所有文件和文件夹. function list_files($dir) { if(is_dir($dir)) { if($handle ...
- PHP实用代码片段(二)
1. 转换 URL:从字符串变成超链接 如果你正在开发论坛,博客或者是一个常规的表单提交,很多时候都要用户访问一个网站.使用这个函数,URL 字符串就可以自动的转换为超链接. function mak ...
- C#程序员经常用到的10个实用代码片段 - 操作系统
原文地址 如果你是一个C#程序员,那么本文介绍的10个C#常用代码片段一定会给你带来帮助,从底层的资源操作,到上层的UI应用,这些代码也许能给你的开发节省不少时间.以下是原文: 1 读取操作系统和C ...
- javascript实用代码片段
持续积累中~ 拓展原型 Function.prototype.method = function(name, extend) { if(!this.prototype[name]) { this.pr ...
随机推荐
- 【Gin-API系列】Gin中间件之日志模块(四)
日志是程序开发中必不可少的模块,同时也是日常运维定位故障的最重要环节之一.一般日志类的操作包括日志采集,日志查询,日志监控.日志统计等等.本文,我们将介绍日志模块在Gin中的使用. Golang如何打 ...
- Docker日常使用方式
前提 在安装docker之前,建议你设置系统的国内镜像源先哦,很快~嗯,快. 阿里云镜像源:https://developer.aliyun.com/mirror/ 安装 安装docker 下面都是官 ...
- 修改linux 动态ip为静态ip
vi /etc/sysconfig/network-scripts/ifcfg-ens33 BOOTPROTO=static 设置网卡引导协议为 静态 ONBOOT=yes 网卡开机自启动 配置[IP ...
- C++ Templates (1.6 但是为什么不...? But, Should't We ...?)
返回完整目录 目录 1.6 但是为什么不...? But, Should't We ...? 1.6.1 传值还是传引用? Pass by Value or by Reference? 1.6.2 为 ...
- 怎样使用laravel的脚手架安装bootstrap
第一步.使用composer引入laravel中的ui库 composer require laravel/ui --dev 第二步.生成bootstrap的基本脚手架 php artisan ui ...
- 3、Entity Framework Core 3.1入门教程-设定字段属性
本文章是根据 微软MVP solenovex(杨旭)老师的视频教程编写而来,再加上自己的一些理解. 视频教程地址:https://www.bilibili.com/video/BV1xa4y1v7rR ...
- 远程调试在Linux车机中的应用
导读 在软件开发过程中,调试是必不可少的环节,嵌入式操作系统的调试与桌面操作系统的调试相比有很大差别,嵌入式系统的可视化调试能力比桌面操作系统要弱一点.对于导航这种业务场景比较复杂的程序开发,可视化调 ...
- 腾讯大牛教你简单的自动化测试模型(Python+Selenium)
今天讲解简单的自动化测试模型,对于刚接触自动化测试的同学,由于没有编程语言的基础,是搞不懂代码里面的函数.封装.包以及其他概念,只是了解字符串.数组.元组及字典这种最基本的名词,更不懂自动化测试框架了 ...
- 现在的市场对 C++ 的需求大吗?
分享 大师助手 先说结论:需求还是很大,但是没有什么初级程序员能干的岗位. 游戏引擎,存储,推荐引擎,infra,各种各样的性能敏感场景.这些都是C++的刚需场景,别的语言基本替代不了的.除了pin ...
- e3mall商城的归纳总结5之修改商品分类、e3mall—content的搭建
说在前面的话 本节基本上没有用到新的知识点.主要还是对数据库的增删改查以及创建了一个新的内容模块. 新增商品分类 由于easyUI的Tree需要三个字段(Id.state.text), [{ &quo ...