摘要：記錄一些項目中用到的正則工具，將持續(xù)更新如果對中的正則不太了解，可以參考一下中正則表達式必知必會字符串操作去除字符串兩邊的空格編碼對等字符轉(zhuǎn)義，避免攻擊找出重復最多的字符把字符串轉(zhuǎn)換為數(shù)組首先進行排序，這樣結(jié)果會把相同的字符放在一起，然后再

記錄一些項目中用到的正則工具，將持續(xù)更新...

如果對JS中的正則不太了解，可以參考一下JS 中正則表達式必知必會

String.prototype.trim = function() {
  return this.replace(/(^s+)|(s+$)/g, "")
}

function htmlEncode(str) {
  return str.replace(/[<>""&]/g, function(rs) {
    switch (rs) {
      case "<":
        return "<"
      case ">":
        return ">"
      case "&":
        return "&"
      case """:
        return "'"
      case """:
        return """
    }
  })
}

let str = "asss23sjdssskssa7lsssdkjsssdss"
const arr = str.split(/s*/)                          // 把字符串轉(zhuǎn)換為數(shù)組
const str2 = arr.sort().join("")                         // 首先進行排序，這樣結(jié)果會把相同的字符放在一起，然后再轉(zhuǎn)換為字符串
let value = ""
let index = 0
str2.replace(/(w)1*/g, function($0, $1) {                 // 匹配字符
  if (index < $0.length) {
    index = $0.length                          // index是出現(xiàn)次數(shù)
    value = $1                                 // value是對應字符
  }
})
console.log(`最多的字符: ${value} ,重復的次數(shù): ${index}`)                 // s 17

下面簡單分析下正則/B(?=(d{3})+(?!d))/g：

/B(?=(d{3})+(?!d))/g：正則匹配非單詞邊界B，邊界后面必須跟著(d{3})+(?!d)

(d{3})+：必須是1個或多個的3個連續(xù)數(shù)字

(?!d)：第2步中的3個數(shù)字不允許后面跟著數(shù)字

(d{3})+(?!d)：所以匹配的邊界后面必須跟著3*n（n>=1）的數(shù)字

最終把匹配到的所有邊界換成,即可

const numFormat = str => str.replace(/B(?=(d{3})+(?!d))/g, ",")

手機號中間4位數(shù)換成*

const validateMobile = str =>  /^[1][0-9]{10}$/.test(str) && str.replace(/(d{3})(d{4})(d{4})/, (rs, $1, $2, $3) => `${$1}****${$3}`)

function getUrlParam(str) {
  const result = {}
  const valid = /(https?|ftp)://[w-_]+(.[w-_]+)+([w-.,@?^=%&:/~+#]*[w-@?^=%&/~+#])?/.exec(str)
  if (!valid) return
  const [rs, $1, $2, $3] = valid
  $3.match(/[a-zA-Z_]+=[^=&?]*/g).forEach(val => val.replace(/^(w+)=(w*)$/, ($0, $1, $2) => {
        result[$1] = $2
      })
  )
  return result
}

getUrlParam("https://www.baidu.com?name=jawil&age=23&d=")         // {name: "jawil", age: "23", d: ""}

"componentMapModelRegistry".match(/^[a-z][a-z0-9]+|[A-Z][a-z0-9]*/g).join("_").toLowerCase();
// component_map_model_registry

"component_map_model_registry".replace(/_(w)/g, (str, letter) => letter.toUpperCase())
// componentMapModelRegistry

export const getFileInfo = fileName => {
  const fileRe = /(.+)(.[a-z0-9]+)$/i
  try {
    const result = fileRe.exec(fileName)
    return {
      name: result[1],
      type: result[2]
    }
  } catch (e) {
    return null
  }
}

用于驗證時，通常需要在前后分別加上^、$、，以匹配整個待驗證字符串

function checkStr(str, type) {
  switch (type) {
    case "phone": //手機號碼
      return /^1d{10}$/.test(str)
    case "tel": // 座機
      return /^(0d{2,3}-d{7,8})(-d{1,4})?$/.test(str)
    case "card": // 身份證
      return /^d{15}|d{18}$/.test(str)
    case "pwd": // 密碼以字母開頭，長度在6~18之間，只能包含字母、數(shù)字和下劃線
      return /^[a-zA-Z]w{5,17}$/.test(str)
    case "postal": // 郵政編碼
      return /[1-9]d{5}(?!d)/.test(str)
    case "QQ": // QQ號 5-11位數(shù)字
      return /^[1-9]d{4,10}$/.test(str)
    case "email": // 郵箱
      return /^[w-]+(.[w-]+)*@[w-]+(.[w-]+)+$/.test(str)
    case "money": // 金額(小數(shù)點2位)
      return /^d*(?:.d{0,2})?$/.test(str)
    case "URL": // 網(wǎng)址
      return /(https?|ftp)://[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 "day":  // 一個月的31天  01-09和1~31
      return /^((0?[1-9])|(([12])[0-9])|30|31)$/.test(str)
    case "month": // 一年的12個月  01-09和1-12
      return /^(0?[1-9]|1[0-2])$/.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 "integer": // 整數(shù) 正整數(shù)或負整數(shù)
      return /^-?d+$/.test(str)
    case "decimal": // 小數(shù)
      return /^(-?d+)(.d+)?$/.test(str)
    case "english": // 英文
      return /^[a-zA-Z]+$/.test(str)
    case "chinese": // 中文
      return /^[u4E00-u9FA5]+$/.test(str)
    case "cname":  // 中文姓名 2-4位漢字
      return /^[u4E00-u9FA5]{2,4}$/.test(str)
    case "lower":  // 小寫
      return /^[a-z]+$/.test(str)
    case "upper":  // 大寫
      return /^[A-Z]+$/.test(str)
    case "HTML":  // HTML標記
      return /<("[^"]*"|"[^"]*"|[^"">])*>/.test(str)
    default:
      throw new Error("檢驗出錯 in function checkStr")
  }
}

function validateURL(textval) {
  const urlregex = /^(https?|ftp)://([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+.)*[a-zA-Z0-9-]+.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(/($|[a-zA-Z0-9.,?"+&%$#=~_-]+))*$/
  return urlregex.test(textval)
}

網(wǎng)上的帖子大多深淺不一，甚至有些前后矛盾，在下的文章都是學習過程中的總結(jié)，如果發(fā)現(xiàn)錯誤，歡迎留言指出~

參考：

JavaScript正則進階之路——活學妙用奇淫正則表達式
js正則驗證方法大全
javascript 總結(jié)（RegExp篇）

PS：歡迎大家關(guān)注我的公眾號【前端下午茶】，一起加油吧~

另外可以加入「前端下午茶交流群」微信群，長按識別下面二維碼即可加我好友，備注加群，我拉你入群～