正則

1.正則的概念

? ? JS誕生的目的是什么桑李?

? ? 就是為了做表單驗證踱蛀。

?? ?在JS未出現(xiàn)以前,表單的信息驗證需要傳輸給后臺贵白,讓后臺做數(shù)據(jù)驗證處理之后率拒,再返回給前端頁面處理的結果。在帶寬有限的情況下禁荒,整個驗證過程非常復雜猬膨,且耗時。


? ? 在使用JS做驗證的過程中呛伴,一個簡單的驗證規(guī)則的實現(xiàn)非常的麻煩勃痴。

?? ?如:從雜亂的字符串中找數(shù)字

? ? var str =?"asd68asd687as6da78sd123123zcacas"

?? ?var linshi='';

?? ?var arr=[]

?? ?for(var i = 0 ; i < str .length ; i ++){

? ? ?? ?if(str.charAt(i)>=0&&str.charAt(i)<=9){

? ? ? ? ?? ?linshi+=str.charAt(i)

? ? ?? ?}else{

? ? ? ? ?? ?if(linshi!=''){

? ? ? ? ? ? ?? ?arr.push(linshi) ? ??

? ? ? ? ?? ?}

? ? ?? ?}

?? ?}

?? ?if(linshi!=''){

? ?? ?? arr.push(linshi) ? ??

?? ?}

?? ?console.log(arr)

? ? 如果使用正則的方式:

? ? var arr = str.match(/\d+/g);

? ?就可以完成功能

?? ?什么是正則?

? ? 正則表達式(regular expression)是一個描述字符規(guī)則的對象热康≌僭牛可以用來檢查一個字符串是否含有某個字符,將匹配的字符做替換或者從某個字符串中取出某個條件的子串等褐隆。


? ? 正則表達式:

?? ?正則表達式其實就是一種規(guī)則污它,其實把正則稱作規(guī)則表達式更為恰當。正則的語法基于一種古老的perl語言庶弃。

? ? 為什么要用正則:

? ? 前端往往有大量的表單數(shù)據(jù)校驗工作衫贬,采用正則表達式會使得數(shù)據(jù)校驗的工作量大大減輕。常用效果:郵箱歇攻,手機號固惯,身份證號等(使用熟練的情況下)

? ? 正則的使用理念:

? ? 任何程序都可以不用正則表達式寫出來,但根據(jù)懶人原則缴守,怎么做不言而喻葬毫。


2.創(chuàng)建方式

? ? 正則的創(chuàng)建方式:

? ? 1.構造函數(shù)方式

?? ?? ? var reg1 = new?RegExp("a");

?? ?? ? var str =?"adassdfsd";

?? ?? ? console.log(str.match(reg1))?? ?? ? //輸出匹配a的字符

? ? 2.字面量方式,古老的perl語言風格

?? ?? ? var reg2 = /a/;

?? ?? ? console.log(str2.match(reg2));? ? ? //輸出匹配a的字符

?? ?? / / 是正則表達式的標識符

?? ?? " " 是字符串的標識符

?? ?? [ ] 是數(shù)組的標識符

?? ?? { } 是對象的標識符


? ? 正則中的修飾符屡穗,寫在正則表達式后面/的后面:

? ? g表示全局匹配贴捡,查找所有

? ? i表示忽略大小寫

? ? 課程目標:郵箱的規(guī)則

123abc@qq.com

?? ?? ? 數(shù)字+英文+@+英文+.+英文


? ? 正則的驗證:

? ? var reg = /[0-9]/;

? ? reg.test(str)? ? //返回為true表示驗證成功,false表示失敗

4.字符串.replace(oldstr, newstr)函數(shù) 和 字符串.match(正則)函數(shù)

? ?字符串的replace函數(shù)的功能:將老字符串替換成新字符串

? ?可以利用此函數(shù)村砂,將老字符串表示成正則表達式烂斋,對字符串進行替換

? ? 如:字符串中的abc替換成“哈哈”,如果正則后面沒有g,則只替換一個汛骂,如果沒有i罕模,則大寫不會替換

? ? var str =?“abc123abc456abbcdABCefaacbcdbcabc";

?? var reg = /abc/g;

? ? console.log(str.replace(reg,"哈哈"));

? ??字符串match函數(shù)的功能:提取所有的想要的東西

? ? 返回一個數(shù)組,包含所有符合條件的字符

? ?\d? ? 匹配所有的數(shù)字

? ? var reg = /\d/g;

? ? console.log(str.match(reg))? ? //打印字符串中所有的數(shù)字

+? ? ?若干帘瞭,量詞淑掌,表示多少個都可以,至少1個蝶念,無上限

? ? var reg = /\d+/g;

? ? console.log(str.match(reg))? ? //打印字符串中所有的數(shù)字,連續(xù)

? ? |? ? ?或抛腕,類似于js中的 ||

? ? var reg = /abc|bbc|cbc|dbc/g

? ? console.log(str.match(reg));? ?//打印字符串中的abc,bbc祸轮,cbc,dbc

? ? var reg = /[a-c]bc/g

? ?[ ]? ? 中元符

? ? var reg = /[a-z]/?? ??? ??? ?? //匹配所有字母

? ? [0-9] == \d

? ? ^? ? ?排除(除了)

? ? var reg = /[^0-9]/?? ??? ??? ??//表示除了數(shù)字之外所有

? ? .?? ? 代表所有侥钳,不建議使用

? ? var reg = /<.+>/g

? ? console.log(str.replace(reg,""))? ??? ??? ?? ?//過濾适袜,表示尖括號里面的東西不要,但是舷夺?

? ? 正則的貪婪定律:

? ? var reg = /<[^<>]+>/g

?? ?console.log(str.replace(reg,"”)) ? ??? ??? ?? //表示尖括號里面的東西不要苦酱,真

? ? 轉義字符:

? ? \d ? ?——?? ?[0-9]? ? ? ? ?數(shù)字

? ? \w ? ?——?? ?[a-z0-9_]?? ??數(shù)字,字母给猾,下劃線

? ? \s ? ?—— ?? 空白字符(空格)? ?

? ? \D? ??——? ? [^0-9]?? ?? ? 非數(shù)字

? ? \W? ??——? ? [^a-z0-9_]? ? 非數(shù)字疫萤,字母,下劃線

? ? \S? ??—— ? ?非空白字符

? ? 量詞:限定符敢伸,可以指定正則表達式的一個給定組扯饶,必須要出現(xiàn)多少次才能滿足匹配

? ? * ? ? 匹配前面的子表達式零次或多次

? ? +? ? ?匹配前面的子表達式至少一次或多次

? ? ?? ? ?匹配前面的子表達是零次或一次

? ? {n}? ?匹配確定n次

? ? {n,}? 至少匹配n次

? ? {n,m}?至少匹配n次,最多匹配m次

? ? 注:在限定符后緊跟池颈?尾序,則由貪婪匹配變成非貪婪匹配

? ? qq號驗證規(guī)則:

? ? var reg?=?/[1-9]\d{4,10}/

? ? 固化的規(guī)則:0411-6666888

? ? 開頭為0或者2的或者三位數(shù)字加上-開頭為非零的八位數(shù)字,結尾是1到4的分機號

? ? var reg =/(0\d{2,3}-)?[1-9]\d{7}(-\d{1,4})?/

?? 復雜郵箱的規(guī)則:英文數(shù)字下劃線@一串英文或數(shù)子.一串英文

? ? var reg =/\w+@[a-z0-9]+\.[a-z]+/i

? ? 想要校驗怎么辦躯砰?在正則轉義字符前加上\

正則的方法

? ??正則.test(字符串)方法每币,返回值是true和false

? ? 正則.test(字符串)有一個特性,就是只要字符串的一部分符合要求琢歇,那么就會返回true

解決方法:

^開始

$結束

exec()找到了返回數(shù)組兰怠,找不到反回null

?? ?小練習:

? ? 刪除多余空格 ?

? ? str.replace(/\s+/g,'');

? ? 刪除首尾空格

? ? str.replace(/^\s+/,'');

? ? str.replace(/\s+$/,'');

? ? 檢查郵政編碼 ?共 6 位數(shù)字,第一位不能為 0

? ? /^[1-9]\d{5}$/

http://tool.oschina.net/uploads/apidocs/jquery/regexp.html

正則表達式手冊

常用檢測方式:

1.中文檢測

?? ?unicode編碼中文監(jiān)測:/^[\u2E80-\u9FFF]+$/

2.用戶名檢測

?? ?正則:/^[a-z0-9_-]{3,16}$/

3.郵箱檢測

?? ?/^([a-z0-9_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,6})$/

?? ??可以多次出現(xiàn)?(字母數(shù)字下劃線.-)@可以出現(xiàn)多個(數(shù)字字母.-).2到6位字母或.

?? ?/^[a-z\d]+(\.[a-z\d]+)*@([\da-z](-[\da-z])?)+(\.{1,2}[a-z]+)+$/

可以有多個(字母數(shù)字)可有多個可無(.多個(字母數(shù)字))@可以多個(數(shù)字字母可 ? 有1次可無(-數(shù)字字母))可以有多個(1或2個.多個字母)

abc123@123abc.com

4.URL檢測

?? ?/^(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w\.-]*)*\/?$/

有1次或0次(http有1次或0次s : //) 可以多個(數(shù)字字母.-) . 2到6位(字母.) 可多個或0個 (可以多個或0個 /數(shù)字字母下劃線.-) 可0或1次/

?? ?http://sh.op-ta.l.baidu.com

5.HTML標簽檢測

?? ?/^<([a-z]+)([^<]+)*(?:>(.*)<\/\1>|\s+\/>)$/

<多個(字母)可多個或0個(除了<的所有字符) ?/>

<多個(字母)可多個或0個(除了<的所有字符)>多個任意字符 ? </重復第一部分的多個字母>

自定義的html標簽

/<[^<>]+>/g

?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末李茫,一起剝皮案震驚了整個濱河市揭保,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌魄宏,老刑警劉巖掖举,帶你破解...
    沈念sama閱讀 211,639評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異,居然都是意外死亡塔次,警方通過查閱死者的電腦和手機方篮,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,277評論 3 385
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來励负,“玉大人藕溅,你說我怎么就攤上這事〖逃埽” “怎么了巾表?”我有些...
    開封第一講書人閱讀 157,221評論 0 348
  • 文/不壞的土叔 我叫張陵,是天一觀的道長略吨。 經常有香客問我集币,道長,這世上最難降的妖魔是什么翠忠? 我笑而不...
    開封第一講書人閱讀 56,474評論 1 283
  • 正文 為了忘掉前任鞠苟,我火速辦了婚禮,結果婚禮上秽之,老公的妹妹穿的比我還像新娘当娱。我一直安慰自己,他們只是感情好考榨,可當我...
    茶點故事閱讀 65,570評論 6 386
  • 文/花漫 我一把揭開白布跨细。 她就那樣靜靜地躺著,像睡著了一般河质。 火紅的嫁衣襯著肌膚如雪冀惭。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,816評論 1 290
  • 那天掀鹅,我揣著相機與錄音云头,去河邊找鬼。 笑死淫半,一個胖子當著我的面吹牛溃槐,可吹牛的內容都是我干的。 我是一名探鬼主播科吭,決...
    沈念sama閱讀 38,957評論 3 408
  • 文/蒼蘭香墨 我猛地睜開眼昏滴,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了对人?” 一聲冷哼從身側響起谣殊,我...
    開封第一講書人閱讀 37,718評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎牺弄,沒想到半個月后姻几,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經...
    沈念sama閱讀 44,176評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 36,511評論 2 327
  • 正文 我和宋清朗相戀三年蛇捌,在試婚紗的時候發(fā)現(xiàn)自己被綠了抚恒。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,646評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡络拌,死狀恐怖俭驮,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情春贸,我是刑警寧澤混萝,帶...
    沈念sama閱讀 34,322評論 4 330
  • 正文 年R本政府宣布,位于F島的核電站萍恕,受9級特大地震影響逸嘀,放射性物質發(fā)生泄漏。R本人自食惡果不足惜允粤,卻給世界環(huán)境...
    茶點故事閱讀 39,934評論 3 313
  • 文/蒙蒙 一崭倘、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧维哈,春花似錦绳姨、人聲如沸登澜。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,755評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽脑蠕。三九已至购撼,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間谴仙,已是汗流浹背迂求。 一陣腳步聲響...
    開封第一講書人閱讀 31,987評論 1 266
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留晃跺,地道東北人揩局。 一個月前我還...
    沈念sama閱讀 46,358評論 2 360
  • 正文 我出身青樓,卻偏偏與公主長得像掀虎,于是被迫代替她去往敵國和親凌盯。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 43,514評論 2 348

推薦閱讀更多精彩內容

  • 1烹玉,正則表達式的作用:匹配一個字符串中的一些內容 2驰怎,聲明和使用: 1)構造函數(shù) var reg=new RegE...
    WDL_1a39閱讀 726評論 0 1
  • --------------------------正則的作用--------------------------...
    G_whk閱讀 613評論 1 5
  • //定義正則表達式的兩種方式,在用構造函數(shù)的時候二打,有些地方是要加轉義字符的县忌。 //1、字面量。 var reg =...
    xiaobing0324閱讀 490評論 0 0
  • Python中的正則表達式(re) import rere.match #從開始位置開始匹配症杏,如果開頭沒有則無re...
    BigJeffWang閱讀 7,064評論 0 99
  • 正則表達式是項目開發(fā)中常用的模式装获,內容替換、表單認證鸳慈、網絡爬蟲等饱溢,通過以下的例子我相信可以大概掌握正則表達式了 定...
    瘋狂小嘉哥閱讀 313評論 0 0