正则表达式

强大的正则,灵活匹配字符,对字符串进行自定义的格式化处理

Posted by page on January 20, 2020

JS正则表达式

string.replace(reg,fn)

实现下划线命名到驼峰命名转换

使用replace + RegExp

function toHill(str){
  // 携带/g全局匹配,将替换所有匹配项
  return str.replace(/_([a-zA-Z])/g,function(match,$){// 匹配串,匹配串的$1
    return $.toUpperCase();
  })
}
console.log(toHill('h_hhh_00'));

这种写法还能自己实现模板字符功能,可以试试;

实现es6的${var}匹配语法

<script type="text/templete" id="tem_tds">
  <tr>
    <td>${name}</td>
    <td>${num}</td>
    <td>${age}</td>
    <td>${sex}</td>
    <td>${score}</td>
  </tr>
</script>
<script type="text/javascript">
  var page = {
    name:"page",
    num:"201710622109",
    age:20,
    sex:"",
    score:96
  }
  var tbody = document.getElementsByTagName("tbody")[0];
  var tem_tds = document.getElementById("tem_tds");
  var tem_string = getTemString(tem_tds,page);
  console.log(tem_string);

  function getTemString(templete,data){
    return templete.innerHTML.replace(/\$\{\w+\}/g,function(matches){
      console.log(matches.match(/[^\$\{\}]+/));
      return data[matches.match(/[^\$\{\}]+/)]
    })
  }

string.match

const match = ("[object String]").match(/^\[object (\w+)\]$/);
return match ? match[1].toLowerCase() : null;
return match && match[1].toLowerCase(); // 返回(\w+)匹配值

匹配成功:match数组第一项为匹配结果,后续项为每个匹配组的值

匹配失败:返回 null

string.search

reg.exec/test

RegExp.exec会进行一次匹配返回结果、RegExp.test会进行一次返回是否成功;

:多次调用会影响reg.lastIndex导致每次匹配结果不同,不建议使用

function toHill(str){
  let reg = /_([a-z])/g;
  let item;   // exec结果,0即匹配结果,1即结果第1组
  do {
    if(item = reg.exec(str)) {
      str = str.replace(item[0],item[1].toUpperCase())
    }
  } while (item);
  return str;
}
console.log(toHill('h_hhh_00'));

RegExp.$n

格式化时间戳

  formatTimestamp(date, fmt = 'yyyy-MM-dd hh:mm:ss') {
    if (!(date instanceof Date)) {
      date = date ? new Date(date) : new Date();
    }
    let o = {
      'M+': date.getMonth() + 1, // 月份
      'D+|d+': date.getDate(), // 日
      'h+': date.getHours(), // 小时
      'm+': date.getMinutes(), // 分
      's+': date.getSeconds(), // 秒
      S: date.getMilliseconds(), // 毫秒
    };
    if (/(Y+|y+)/.test(fmt))
      fmt = fmt.replace(
        RegExp.$1,
        (date.getFullYear() + '').substr(4 - RegExp.$1.length)
      );
    for (let k in o) {
      if (new RegExp('(' + k + ')').test(fmt))
        fmt = fmt.replace(
          RegExp.$1,
          RegExp.$1.length == 1
            ? o[k]
            : ('00' + o[k]).substr(('' + o[k]).length)
        );
    }
    return fmt;
  }

断言(限制位置)

  • 前瞻断言
    • (?=exp) 顺序肯定环视,表示所在位置右侧能够匹配exp
    • (?!exp) 顺序否定环视,表示所在位置右侧不能匹配exp
  • 后瞻断言
    • (?<=exp) 逆序肯定环视,表示所在位置左侧能够匹配exp
    • (?exp) 逆序否定环视,表示所在位置左侧不能匹配exp
var s="12345678";
s.replace(/(\d)(?=(\d{3})+$)/g,"$1,");