作为一线程序猿，要想少加班、抽空把妹，就要想办法提高工作效率。这里提一个小点，我们在业务开发过程中，经常会重复用到 日期格式化、 url参数转对象、 浏览器类型判等一类函数，这些工具类函数，基本上在每个项目都会用到，为避免不同项目多次复制粘贴的麻烦，我们可以统一封装，可以定义自己的*.js文件或发布到 npm，以提高开发效率。
// 1，获取滚动条至顶部的距离
// 返回num
1 function getScrollTop(){
2 return (document.documentElement &&
3 document.documentElement.scrollTop) ||
4 document.body.scrollTop
5 }
// 2,随机生成颜色
// 返回str
1 function randomColor(){
2 return ‘#‘ +
3 (function(color){
4 return (color += ‘0123456789abcdef‘[Math.floor(Math.random()*16)])
5 && (color.length == 6) ? color : arguments.callee(color);
6 })(‘‘);
7 }
// 3，获取浏览器类型和版本
// 返回str
1 function getExplore() {
2 var sys = {},
3 ua = navigator.userAgent.toLowerCase(),
4 s;
5 (s = ua.match(/rv:([\d.]+)\) like gecko/)) ? sys.ie = s[1]:
6 (s = ua.match(/msie ([\d\.]+)/)) ? sys.ie = s[1] :
7 (s = ua.match(/edge\/([\d\.]+)/)) ? sys.edge = s[1] :
8 (s = ua.match(/firefox\/([\d\.]+)/)) ? sys.firefox = s[1] :
9 (s = ua.match(/(?:opera|opr).([\d\.]+)/)) ? sys.opera = s[1] :
10 (s = ua.match(/chrome\/([\d\.]+)/)) ? sys.chrome = s[1] :
11 (s = ua.match(/version\/([\d\.]+).*safari/)) ? sys.safari = s[1] : 0;
12
13 // 根据关系进行判断
14 if(sys.ie) return (‘IE: ‘+ sys.ie)
15 if (sys.edge) return (‘EDGE: ‘ + sys.edge)
16 if (sys.firefox) return (‘Firefox: ‘ + sys.firefox)
17 if (sys.chrome) return (‘Chrome: ‘ + sys.chrome)
18 if (sys.opera) return (‘Opera: ‘ + sys.opera)
19 if (sys.safari) return (‘Safari: ‘+ sys.safari)
20 return ‘Unkonwn‘
21 }
1 //4 指定范围随机数
2 //返回num
3 function randomNum(min, max) {
4 return Math.floor(min + Math.random() * (max - min));
5 }
1 // 5判断是否为邮箱地址
2 // 返回true/false
3 function isEmail(str) {
4 return /\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/.test(str);
5 }
1 // 6判断是否为省份证
2 // 返回true/false
3 function isIdCard(str) {
4 return /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/.test(str)
5 }
1 // 7判断是否为手机号
2 // 返回true/false
3 function isPhoneNum(str) {
4 return /^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/.test(str)
5 }
1 // 8判断是否为url地址
2 // 返回true/false
3 function isUrl(str) {
4 return /[[email protected]:%._\+~#=]{2,256}\.[a-z]{2,6}\b([[email protected]:%_\+.~#?&//=]*)/i.test(str);
5 }
1 // 9现金转大写
2 // 返回str
3 function digitUppercase(n) {
4 var fraction = [‘角‘, ‘分‘];
5 var digit = [‘零‘, ‘壹‘, ‘贰‘, ‘叁‘, ‘肆‘,‘伍‘, ‘陆‘, ‘柒‘, ‘捌‘, ‘玖‘];
6 var unit = [[‘元‘, ‘万‘, ‘亿‘],[‘‘, ‘拾‘, ‘佰‘, ‘仟‘]];
7 var head = n < 0 ? ‘欠‘: ‘‘;
8 var n = Math.abs(n);
9 var s = ‘‘;
10 for (var i = 0; i < fraction.length; i++) {
11 s += (digit[Math.floor(n * 10 * Math.pow(10, i)) % 10] + fraction[i]).replace(/零./, ‘‘);
12 }
13 s = s || ‘整‘;
14 n = Math.floor(n);
15 for (var i = 0; i < unit[0].length && n > 0; i++) {
16 var p = ‘‘;
17 for (var j = 0; j < unit[1].length && n > 0; j++) {
18 p = digit[n % 10] + unit[1][j] + p;
19 n = Math.floor(n / 10);
20 }
21 s = p.replace(/(零.)*零$/, ‘‘).replace(/^$/, ‘零‘) + unit[0][i] + s;
22 }
23
24 return head + s.replace(/(零.)*零元/, ‘元‘).replace(/(零.)+/g, ‘零‘).replace(/^整$/, ‘零元整‘);
25 };
1 // 10，序列化对象
2 function stringfyQueryString(obj) {
3 if (!obj) return ‘‘;
4 var pairs = [];
5 for (var key in obj) {
6 var value = obj[key];
7 if (value instanceof Array) {
8 for (var i = 0; i < value.length; ++i) {
9 pairs.push(encodeURIComponent(key + ‘[‘ + i + ‘]‘) + ‘=‘ + encodeURIComponent(value[i]));
10 }
11
12 continue;
13 }
14 pairs.push(encodeURIComponent(key) + ‘=‘ + encodeURIComponent(obj[key]));
15 }
16 return pairs.join(‘&‘);
17 }
// 11,数组转字符串
function arrayToString(arr){
var string=arr.join(‘,‘);
return string;
}
1 // 12,字符串转数组
2 function stringToArray(str){
3 var array = str.split(‘,‘);
4 return array;
5 }
1 //13,在min和max之间取出n个随机不重复的数
2 function getNum(n,min,max){
3 for(var i=0,arr=[];i<n;i++){
4 var r=Math.floor(Math.random()*(max-min+1)+min);
5 if(arr.indexOf(r)==-1){
6 arr.push(r);
7 }else{
8 i--;
9 }
10 }
11 return arr;
12 }
1 //14,在min和max之间取出n个不重复的随机数
2 function get(n,min,max){
3 for(var i=0,arr=[];i<n;i++){
4 arr[i]=Math.floor(Math.random()*(max-min+1)+min);
5 for(var j=0;j<i;j++){
6 if(arr[i]==arr[j]){
7 i--;
8
9 }
10 }
11 }
12 return arr;
13 }
1 //原生js仿jq中ajax(）请求
2
3 //支持跨域
4
5 function ajax(obj) {
6 var xmlhttp, type, url, async, dataType, data;
7 if (typeof(obj) != ‘object‘) return false;
8
9 type = obj.type == undefined ? ‘POST‘ : obj.type.toUpperCase();
10 url = obj.url == undefined ? window.location.href : obj.url;
11 async = obj.async == undefined ? true : obj.type;
12 dataType = obj.dataType == undefined ? ‘HTML‘ : obj.dataType.toUpperCase();
13 data = obj.data == undefined ? {} : obj.data;
14
15
16 var formatParams = function () {
17 if (typeof(data) == "object") {
18 var str = "";
19 for (var pro in data) {
20 str += pro + "=" + data[pro] + "&";
21 }
22 data = str.substr(0, str.length - 1);
23 }
24 if (type == ‘GET‘ || dataType == ‘JSONP‘) {
25 if (url.lastIndexOf(‘?‘) == -1) {
26 url += ‘?‘ + data;
27 } else {
28 url += ‘&‘ + data;
29 }
30 }
31 }
32 if (window.XMLHttpRequest) {
33 xmlhttp = new XMLHttpRequest();
34 } else {
35 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
36 }
37
38
39 if (dataType == ‘JSONP‘) {
40 if (typeof(obj.beforeSend) == ‘function‘)obj.beforeSend(xmlhttp);
41 var callbackName = (‘jsonp_‘ + Math.random()).replace(".", "");
42 var oHead = document.getElementsByTagName(‘head‘)[0];
43 data.callback = callbackName;
44 var ele = document.createElement(‘script‘);
45 ele.type = "text/javascript";
46 ele.onerror = function () {
47 console.log(‘请求失败‘);
48 obj.error && obj.error("请求失败");
49 };
50
51 oHead.appendChild(ele);
52 window[callbackName] = function (json) {
53 oHead.removeChild(ele);
54 window[callbackName] = null;
55 obj.success && obj.success(json);
56 };
57 formatParams();
58 ele.src = url;
59
60
61 return ;
62 } else {
63 formatParams();
64 xmlhttp.open(type, url, async);
65 xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded; charset=utf-8");
66 if (typeof(obj.beforeSend) == ‘function‘)obj.beforeSend(xmlhttp);
67 xmlhttp.send(data);
68 xmlhttp.onreadystatechange = function () {
69
70 if (xmlhttp.status != 200) {
71 console.log(xmlhttp.status + ‘错误‘);
72 obj.error && obj.error(xmlhttp.status + ‘错误‘);
73 return ;
74 }
75
76 if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
77
78 if (dataType == ‘JSON‘) {
79 try {
80 res = JSON.parse(xmlhttp.responseText);
81 } catch (e) {
82 console.log(‘返回的json格式不正确‘);
83 obj.error(‘返回的json格式不正确‘);
84 }
85
86 } else if (dataType == ‘XML‘) {
87 res = xmlhttp.responseXML;
88 } else {
89 res = xmlhttp.responseText;
90 }
91
92 obj.success && obj.success(res);
93
94 }
95 }
96 }
97 };
来源:前端大视界
原文地址：https://www.cnblogs.com/mhxy13867806343/p/8447925.html
时间： 2024-10-05 05:52:47