前端培訓-初級階段（13） - 正則表達式

前端最基礎的就是 HTML+CSS+Javascript。掌握了這三門技術就算入門，但也僅僅是入門，如今前端開發的定義已經遠遠不止這些。前端小課堂（HTML/CSS/JS），本着提高技術水平，打牢基礎知識的中心思想，咱們開課啦（每週四）。

該文爲前端培訓-初級階段（1三、18）的補充內容 (介紹了 ECMAScript 歷史，ES6 經常使用點)。

本文介紹ECMAScript基礎知識。

1. 前端培訓-初級階段（13） - ECMAScript （語法、變量、值、類型、運算符、語句）
2. 前端培訓-初級階段（13） - ECMAScript （內置對象、函數）
3. 前端培訓-初級階段（13） - 類、模塊、繼承

基礎內容知識咱們會用到。默認已讀。

咱們要講什麼？

1. 正則表達式基本的關鍵詞
2. 正則表達式一些進階用法（預查斷言）
3. 常見正則
4. 實戰場景

正則表達式基本的關鍵詞

1. 聲明一個正則表達式
   1）var reg=new RegExp('規則','條件');
   由於規則是一個字符串，因此能夠拼接，好比new RegExp(['違規','罵人','涉黃','涉政'].join('|')).test('正經人涉黃')在這個場景當中，咱們須要根據其餘詞庫，來生成過濾正則。

   2）var reg=/規則/條件;
   通常來講咱們使用這個，方便快捷

2. 條件

   關鍵詞	說明	用法
   i	ignore 忽略大小寫	通常用在標籤匹配好比 <img>和<IMG>
   g	global 全局	通常用在須要匹配多個區域的時候好比違規詞語要替換成**
   m	multiline 多行	這個用的比較少

3. 規則
   裏面的全部｜都是錯的，須要本身替換成半角的|

   關鍵詞	匹配項 說明	用法
   字符串	常規字符 直接填入你要匹配的字符便可，關鍵詞須要轉義	'罵人，罵人的話'.replace(/罵人/g, '**')
   \d	數字0-9的縮寫，也等價於[0-9]	'0313-0000000'.replace(/\d/g, '*')
   \w	單詞，也等價於[a-zA-Z0-9_]	'tel: 0313-;URI: lilnong.top'.replace(/\w/g, '*')
   \s	任何不可見字符，包括空格、換行等。等價於[ \f\n\r\t\v]	' \f\n\r\t\v'.replace(/\s/g, '*')
   \b	單詞邊界，相似於$	'lists list'.replace(/s\b/g, '')
   \D \W \S \B	等同於上面小寫的取反
   \num	匹配以前的分組num爲索引，能夠用來查找重複字符	'abbcccddddeffffffff'.match(/(\w)\1+/g)
   ( )	分組 能夠用來給\num匹配，也能夠用來給match函數使用
   ｜	或 用來標識關鍵字匹配其中的便可	'x + y = ?'.replace(/x｜y/g,()=>Math.random()*50>>0)
   [xyz]	字符集合 比較經常使用裏面能夠放上面的關鍵詞	'x + y = ?'.replace(/[xy]/g,()=>Math.random()*50>>0)
   .	除「\n」和"\r"以外的任何單個字符。

   上面介紹了常見的規則，其實還有一些匹配的量詞

   關鍵詞	匹配項 說明	用法
   ^	標識開始	'onchange'.match(/^on\w+/)
   $	標識結束	'abc.mp4.avi'.match(/\.\w+$/)
   *	0或多個，等價於{0,}	'abbccc'.match(/a*/g)
   +	1或多個，等價於{1,}	'abbccc'.match(/a+/g)
   ?	0活1個，等價於{0,1}	'abbccc'.match(/a?/g)
   {n,m}	n和m能夠省略一個，也能夠都寫上，限定個數

正則表達式一些進階用法（預查）

js中的支持的不是很好

1. 將簡單的網址：www.abc.com中的中間部分abc提取出來
2. 正向零寬先行斷言 'https://segmentfault.com/write'.match(/\w+(?=\.com)/)

3.

常見正則

1. 郵箱 /\w+@\w+(\.\w+)+/
2. 手機號 /^1\d{10}$/.test('15075754545')

實戰

1. 匹配歌詞文件

   

2. 獲取URL中的參數
   location.search.match(/[?&]q=[^&]*/) q爲key

後記

主講人文章-2019.04.18。

我雖然忙沒寫出來，可是學習咱們是一直在作的。趕趕進度。