开发过程中经常需要用到重复的方法。而这些重复的方法就是轮子。让未来遇到的一些问题可以通过这些方法进行解决。当然网上的轮子固然好用,但如果自己写的肯定是最好的,如果自己封装,那最好也要想办法解读它。
对象转url参数
/* 指定对象转url参数
param 一个对象(一级对象) */ function urlEncode(param, key, encode) { if (param == null) return ''; var paramStr = ''; var t = typeof(param); if (t == 'string' || t == 'number' || t == 'boolean') { paramStr += '&' + key + '=' + ((encode == null || encode) ? encodeURIComponent(param) : param); } else { for (var i in param) { var k = key == null ? i : key + (param instanceof Array ? '[' + i + ']' : '.' + i) paramStr += urlEncode(param[i], k, encode) } } return paramStr; } //调用 console.log(urlEncode({a:1,b:2}))//&a=1&b=2
获取url中的参数值
/* 获取当前url中的指定参数值 name 指定参数名 */ function getQueryString(name){ var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if (r != null) return unescape(r[2]); return null; } //调用 console.log(getQueryString("a"))//1 //若当前url为:http://xxx.com?a=1,则返回1,若没有参数a,则返回null /* 获取指定url中的指定参数值 url 指定url name 指定参数名 */ function getUrlQueryString(url,name){ var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); var s=url.indexOf("?"); var r = url.substring(s+1).match(reg); if (r != null) return unescape(r[2]); return null; } //调用 getUrlQueryString("http://www.baidu.com?a=2&b=3","a")//2
更改url的访问参数(增加参数、修改参数)
/* 更改url的访问参数(增加参数、修改参数)
url 你要修改的url params 你要加入的参数 json格式 */ function extendUrlSearch(url,params){ var urlSearch = url.split('?')[1]; var tempObj = {}; var paramsArr = [] var urlHash = ''; if (urlSearch) { // 如果url中有hash,则会包含 urlSearch = urlSearch.split('&'); // 提取查询参数到对象 urlSearch.map(function (item, i) { // 带上原有的hash if (item.indexOf('#') > 0) { urlHash = item.split('#')[1] item = item.split('#')[0] } var key = item.split('=')[0], val = item.split('=')[1]; tempObj[key] = val }) } // 添加参数, 会覆盖同名key Object.assign(tempObj, params); Object.keys(tempObj).map(function (k) { paramsArr.push(k + '=' + tempObj[k]) }) url = url.split('?')[0] + '?' + paramsArr.join('&') if (urlHash) { url += '#' + urlHash } return url; } //调用
console.log(extendUrlSearch("https://www.baidu.com/",{a:1,b:2}))//https://www.baidu.com/?a=1&b=2
生成指定位数内的随机数
/* 生成指定位数内的随机数
length 生成的随机数最大位数 */ function random(length){ var l = '1', length = length ? length : 6; for (var i = 0; i < length; i++) { l += '0'; } l = Number(l); return Math.floor(Math.random() * l); } //调用 console.log(random(2))//0-100之间的整数 不包含0/100
对象转数组
/* 对象转数组 obj 需要转换的对象 */ function toArray(obj){ var arr = []; for (var k in obj) { arr.push(obj[k]); } return arr; } //调用 console.log(toArray({a:1,b:2,c:3}))//[1,2,3]
模板拼装字符串(根据指定的模板和提供的数据,生成字符串。常用于dom生成。类似jsx)
/* 模板拼装字符串 tpl 模板 不能用. 用[] obj 对象 */ function tplConnect(tpl,obj){ var rel = ''; rel = tpl.replace(/\{([\w|\[|\]]+)\}/gi, function(word, key) { if (obj[key] != undefined) {//若obj含有这个属性,则返回obj的属性值 return obj[key]; } else { var oldWord = word; word = word.replace(/\{(\w+)\[(\w+)\]\}/gi, function(a, b, c, d) { if (obj[b] != undefined && obj[b][c] != undefined) { return obj[b][c]; } else { return c; } }) return word; } }); return rel; } //调用 var tpl='<div>{a}</div><div>{b[x]}</div><div>{b[y]}</div>'; var obj={a:1,b:{x:2,y:3}} console.log(tplConnect(tpl,obj));//<div>1</div><div>2</div><div>3</div>
获取当前时间信息
/* 获取当前时间信息 */ function getDate(){ var t={}; var d=new Date(); t.YY=d.getYear();//取当前年份(从1900年到现在过了几年) t.yyyy=d.getFullYear();//取完整年份(4位) t.MM=d.getMonth();//取当前月份(0-11 +1后才是) t.dd=d.getDate();//取当前几号 t.day=d.getDay();//取当前星期几 t.HH=d.getHours();//取当前小时数(0-23) t.mm=d.getMinutes();//取当前分钟数(0-59) t.ss=d.getSeconds();//取当前秒数(0-59) t.ms=d.getMilliseconds();//取当前毫秒数(0-999) t.localeDate=d.toLocaleDateString();//取当前日期(yyyy/MM/dd) t.localeTime=d.toLocaleTimeString();//取当前时间(下午hh:mm:ss) t.locale=d.toLocaleString();//取当前日期与时间(yyyy/MM/dd 下午hh:mm:ss) t.time=d.getTime();//取时间戳 return t; }
//调用 console.log(getDate())