正则匹配（整数小数空格网址参数千分符）

实际项目中经常用的正则匹配，网上找的很多复制的甚至是错的，在这里总结一下，会不定时更新，省得每次碰到再去找自己以前的项目。

一、输入框去除空格和字符，只保留浮点数

放在onchange函数里面，只要出现字母、空格和小数点，立刻替换成空字符

e.target.value = e.target.value.replace(/\s+|[^\d.]/g, '')

二、 输入框输入匹配有效数字，包括带小数点的数字 包含限制小数位数、整数位数

   /*
    * 规则分析
    * 1.可能出现 + - 号，也可能不出现  [+-]?
    * 2.一位0-9都可以，多位首位不能是0 (\d|([1-9]\d+))
    * 3.小数部分可能有可能没有，一旦有后面必须有小数点+数字 (\.\d+)?
    */
let reg = /^[+-]?(\d|([1-9]\d+))(\.\d+)?$/; //不限制整数和小数位数
let reg = /^[+-]?(\d|([1-9]\d{1,6}))(\.\d+)?$/; //限制整数位数,这里限制最多7位整数
let reg = /^[+-]?(\d|([1-9]\d{1,6}))(\.\d{1,2})?$/; //限制整数位数,这里限制最多2位小数,如果出现小数点就必须至少有一位小数

三 输入框相关

   // 只限英文数字下划线
   /^\w+$/
   // 中文或者英文
   /^[\u4E00-\u9FA5A-Za-z]+$/

四、获取网址参数

获取网址url问号后面的参数信息(可能包括hash值)，比如网址是“www.baidu.com?lx=1&id=3#picture”。 我们想获取类型是什么（lx），id是多少（id）。

// 使用自执行函数形成闭包，防止污染全局变量
(function (){
    /* 
    *  queryURLParams: 获取网址url问号后面的参数信息(可能包括hash值)
    *  @params
    *  @return
    *    把问号后面的信息以键值对的形式保存下来
    *    by Evan Huang  2020-09-18
    */
     function queryURLParams() {
        let obj = {}
        // 使用[]里面的^字符表示除去=?#&这几个的字符都能匹配，用[]外面的+表示一个或者多个
        this.replace(/([^=?#&]+)=([^=?#&]+)/g, (...[,$1,$2]) => obj[$1]=$2)
        this.replace(/#([^^=?#&]+)/g, (...[,$1]) => obj['HASH']=$1) 
        return obj
    }
    // 用循环的形式将多个函数一次性存在String原型上，方便以后扩展
    ['queryURLParams'].forEach((item) => {
        String.prototype[item] = eval(item)
    })
})()

let url = 'www.baidu.com?lx=1&id=3#picture'
console.log(url.queryURLParams())

五、时间字符串格式化

(function () {
	/*
	 * formatTime：时间字符串的格式化处理
	 *   @params
	 *     templete:[string] 我们最后期望获取日期格式的模板
	 *     模板规则:{0}->年  {1~5}->月日时分秒
	 *   @return
	 *     [string]格式化后的时间字符串
	 *  
	 */
	function formatTime(templete = "{0}年{1}月{2}日 {3}时{4}分{5}秒") {
		let timeAry = this.match(/\d+/g);
		return templete.replace(/\{(\d+)\}/g, (...[, $1]) => {
			let time = timeAry[$1] || "00";
			return time.length < 2 ? "0" + time : time;
		});
	}

	/* 扩展到内置类String.prototype上 */
	["formatTime"].forEach(item => {
		String.prototype[item] = eval(item);
	});
})();

//=>服务器获取的
// "2019-8-13 16:51:3"
// "2019/8/13 16:51:3"
// "2019/8/13"
//=>想要转变为的格式
// "08月13日 16时51分"
// "2019年08月13日"
// "2019年08月13日 16时51分03秒"
console.log("2019-8-13 16:51:3".match(/\d+/g))
console.log("2019-8-13 16:51:3".formatTime())
console.log("2019-8-13 16:51:3".formatTime('{1}月{2}日 {3}时{4}分'))

六、大数字转换为千分符格式

1行代码解决问题，比如输入492384934893，得到492,384,934,893

// 使用自执行函数形成闭包，防止污染全局变量
(function (){
    /* 
    *  milimeter: 实现大数字的千分符处理
    *  @params
    *  @return
    *    [string] 返回千分符
    *    by Evan Huang  2020-09-18
    */
    function milimeter () {
        return this.replace(/\d{1,3}(?=(\d{3})+$)/g, content=> content + ',')
    }
    // 用循环的形式将多个函数一次性存在String原型上，方便以后扩展
    ['milimeter'].forEach((item) => {
        String.prototype[item] = eval(item)
    })
})()

let num = '492384934893'
console.log(num.milimeter())