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

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

1. 字符串操作

去除字符串兩邊的空格 trim

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

HTML編碼對< > ' " &等字符轉(zhuǎn)義，避免XSS攻擊

function htmlEncode(str) {return str.replace(/[\<\>\"\'\&]/g, function(rs) {switch (rs) {case '<':return '&lt;'case '>':return '&gt;'case '&':return '&amp;'case ''':return '&apos;'case '"':return '&quot;'}}) }

找出重復(fù)最多的字符

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是對應(yīng)字符} }) console.log(`最多的字符: ${value} ,重復(fù)的次數(shù): ${index}`) // s 17

數(shù)字格式化，1234567890 -> 1,234,567,890

下面簡單分析下正則/\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}`)

取URL中query到一個對象中

function getUrlParam(str) {const result = {}const valid = /(https?|ftp):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?/.exec(str)if (!valid) returnconst [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: ""}

駝峰轉(zhuǎn)下劃線

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

下劃線轉(zhuǎn)駝峰

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

2. 驗證

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

常用正則驗證

function checkStr(str, type) {switch (type) {case 'phone': //手機號碼return /^1\d{10}$/.test(str)case 'tel': // 座機return /^(0\d{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': // IPreturn /((?:(?: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~31return /^((0?[1-9])|(([12])[0-9])|30|31)$/.test(str)case 'month': // 一年的12個月 01-09和1-12return /^(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')} }

驗證是否是合法URL

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篇）

總結(jié)

以上是生活随笔為你收集整理的JS 活学活用正则表达式的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。