前端經常使用的正則表達式

時間 2019-12-07

原文原文鏈接

替換

經過一些例子來學習正則表達式摘錄，js正則函數match、exec、test、search、replace、splitjavascript

去除首尾的

//去除首尾的‘/’
input = input.replace(/^\/*|\/*$/g,'');

javascript:; 、javascript:void(0)

'javascript:;'.match(/^(javascript\s*\:|#)/);
//["javascript:", "javascript:", index: 0, input: "javascript:;"]

匹配

var str = "access_token=dcb90862-29fb-4b03-93ff-5f0a8f546250; refresh_token=702f4815-a0ff-456c-82ce-24e4d7d619e6; account_uid=1361177947320160506170322436";
str.match(/account_uid=([^\=]+(\;)|(.*))/ig);

匹配一些字符

var str = 'asdf html-webpack-plugin for "index/index.html" asdfasdf';
str.match(/html-webpack-plugin for \"(.*)\"/ig);
console.log(RegExp.$1) //=>index/index.html

關鍵字符替換

'css/[hash:8].index-index.css'.replace(/\[(?:(\w+):)?(contenthash|hash)(?::([a-z]+\d*))?(?::(\d+))?\]/ig,'(.*)');
//=> css/(.*).index-index.css

替換參數中的值

var str  = '<!DOCTYPE html><html manifest="../../cache.manifest" lang="en"><head><meta charset="UTF-8">';
str.replace(/<html[^>]*manifest="([^"]*)"[^>]*>/,function(word){
   return word.replace(/manifest="([^"]*)"/,'manifest="'+url+'"');
}).replace(/<html(\s?[^\>]*\>)/,function(word){
    if(word.indexOf('manifest')) return word;
    return word.replace('<html','<html manifest="'+url+'"');
});
//原：<!DOCTYPE html><html manifest="../../cache.manifest" lang="en"><head><meta charset="UTF-8">
//替換成=> <!DOCTYPE html><html manifest="cache.manifest" lang="en"><head><meta charset="UTF-8">

匹配括號內容

'max_length(12)'.match(/^(.+?)\((.+)\)$/)
// ["max_length(12)", "max_length", "12", index: 0, input: "max_length(12)"]

調換

var name = "Doe, John"; 
name.replace(/(\w+)\s*, \s*(\w+)/, "$2 $1"); 
//=> "John Doe"

字符串截取

var str = 'asfdf === sdfaf ##'
str.match(/[^===]+(?=[===])/g) // 截取 ===以前的內容

str.replace(/\n/g,'')  // 替換字符串中的 \n 換行字符

驗證

小數點後幾位驗證

// 精確到1位小數
/^[1-9][0-9]*$|^[1-9][0-9]*\.[0-9]$|^0\.[0-9]$/.test(1.2);

// 精確到2位小數
/^[0-9]+(.[0-9]{2})?$/.test(1.221);

密碼強度正則

// 必須是包含大小寫字母和數字的組合，不能使用特殊字符，長度在8-10之間。
/^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,10}$/.test("weeeeeeeW2");
//密碼強度正則，最少6位，包括至少1個大寫字母，1個小寫字母，1個數字，1個特殊字符
/^.*(?=.{6,})(?=.*\d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*? ]).*$/.test("diaoD123#");
//輸出 true

校驗中文

/^[\u4e00-\u9fa5]{0,}$/.test("可是d"); //false
/^[\u4e00-\u9fa5]{0,}$/.test("可是"); //true
/^[\u4e00-\u9fa5]{0,}$/.test("可是"); //true

包含中文正則

/[\u4E00-\u9FA5]/.test("可是d") //true

由數字、26個英文字母或下劃線組成的字符串

/^\w+$/.test("ds2_@#"); // false

身份證號正則

//身份證號（18位）正則
/^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/.test("42112319870115371X");
//輸出 false

校驗日期

「yyyy-mm-dd「格式的日期校驗，已考慮平閏年。css

//日期正則，簡單斷定,未作月份及日期的斷定
var dP1 = /^\d{4}(\-)\d{1,2}\1\d{1,2}$/;
//輸出 true
console.log(dP1.test("2017-05-11"));
//輸出 true
console.log(dP1.test("2017-15-11"));
//日期正則，複雜斷定
var dP2 = /^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$/;
//輸出 true
console.log(dP2.test("2017-02-11"));
//輸出 false
console.log(dP2.test("2017-15-11"));
//輸出 false
console.log(dP2.test("2017-02-29"));
// true

校驗文件後綴

var strRegex = "(.jpg|.gif|.txt)";
  var re=new RegExp(strRegex);
  if (re.test(str)){
    
  }
/(.jpg|.gif)+(\?|\#|$)/.test('a/b/c.jpgsss'); //=> false
/(.jpg|.gif)+(\?|\#|$)/.test('a/b/c.jpg?'); //=> true

用戶名正則

//用戶名正則，4到16位（字母，數字，下劃線，減號）
/^[a-zA-Z0-9_-]{4,16}$/.test("diaodiao");
//輸出 true

整數正則

/^\d+$/.test("42");    //正整數正則  -> 輸出 true
/^-\d+$/.test("-42");  //負整數正則  -> 輸出 true
/^-?\d+$/.test("-42"); //整數正則  -> 輸出 true

/^[0-9]+$/.test(25.5455) //正整數正則  -> 輸出 false
// 浮點數
/^(?:[-+])?(?:[0-9]+)?(?:\.[0-9]*)?(?:[eE][\+\-]?(?:[0-9]+))?$/.test(0.2)

數字正則

能夠是整數也能夠是浮點數html

/^\d*\.?\d+$/.test("42.2");     //正數正則  -> 輸出 true
/^-\d*\.?\d+$/.test("-42.2");   //負數正則 -> 輸出 true
/^-?\d*\.?\d+$/.test("-42.2");  //數字正則 -> 輸出 true

Email正則

//Email正則
/^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/.test("wowohoo@qq.com");
//輸出 true

// 1.郵箱以a-z、A-Z、0-9開頭，最小長度爲1.
// 2.若是左側部分包含-、_、.則這些特殊符號的前面必須包一位數字或字母。
// 3.@符號是必填項
// 4.右則部分可分爲兩部分，第一部分爲郵件提供商域名地址，第二部分爲域名後綴，現已知的最短爲2位。
//   最長的爲6爲。
// 5.郵件提供商域能夠包含特殊字符-、_、.
/^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/.test("wowohoo@qq.com");

傳真號碼

// 國家代碼(2到3位)-區號(2到3位)-電話號碼(7到8位)-分機號(3位)
/^(([0\+]\d{2,3}-)?(0\d{2,3})-)(\d{7,8})(-(\d{3,}))?$/.test('021-5055455')

手機號碼正則

//手機號正則
/^1[34578]\d{9}$/.test("13611778887");
//輸出 true

//* 13段：130、13一、13二、13三、13四、13五、13六、13七、13八、139
//* 14段：14五、147
//* 15段：150、15一、15二、15三、15五、15六、15七、15八、159
//* 17段：170、17六、17七、178
//* 18段：180、18一、18二、18三、18四、18五、18六、18七、18八、189
//* 國際碼 如：中國(+86)
/^((\+?[0-9]{1,4})|(\(\+86\)))?(13[0-9]|14[57]|15[012356789]|17[03678]|18[0-9])\d{8}$/.test("13611778887");

URL正則

//URL正則
/^((https?|ftp|file):\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/.test("http://wangchujiang.com");
//輸出 true

//獲取url中域名、協議正則 'http://xxx.xx/xxx','https://xxx.xx/xxx','//xxx.xx/xxx'
/^(http(?:|s)\:)*\/\/([^\/]+)/.test("http://www.baidu.com");

/^((http|https):\/\/(\w+:{0,1}\w*@)?(\S+)|)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?$/.test('https://www.baidu.com/s?wd=@#%$^&%$#')

// 必須有協議 
/^[a-zA-Z]+:\/\//.test("http://www.baidu.com");

IPv4地址正則

//ipv4地址正則
/^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/.test("192.168.130.199");
//輸出 true

十六進制顏色正則

//RGB Hex顏色正則
/^#?([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/.test("#b8b8b8");
//輸出 true

QQ號碼正則

//QQ號正則，5至11位
/^[1-9][0-9]{4,10}$/.test("398188661");//輸出 true

微信號正則

//微信號正則，6至20位，以字母開頭，字母，數字，減號，下劃線
/^[a-zA-Z]([-_a-zA-Z0-9]{5,19})+$/.test("jslite"); //輸出 true

車牌號正則

//車牌號正則
/^[京津滬渝冀豫雲遼黑湘皖魯新蘇浙贛鄂桂甘晉蒙陝吉閩貴粵青藏川寧瓊使領A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9掛學警港澳]{1}$/.test("滬B99116") //輸出 true

顏色值校驗

// HEX 顏色正則
/^#?([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test("#ccb2b2")

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。