一、定義

設計思想是用一種描述性的語言定義一個規(guī)則，凡是符合規(guī)則的字符串，我們就認為它“匹配”了，否則，該字符串就是不合法的。

在 JavaScript中，正則表達式也是對象，構(gòu)建正則表達式有兩種方式：

1、字面量創(chuàng)建，其由包含在斜杠之間的模式組成

2、調(diào)用RegExp對象的構(gòu)造函數(shù)

二、匹配規(guī)則

常見的校驗規(guī)則如下：

正則表達式標記

三、匹配方法

正則表達式常被用于某些方法，我們可以分成兩類：

• 字符串（str）方法：match、matchAll、search、replace、split
• 正則對象下（regexp）的方法：test、exec

str.match(regexp)

str.match(regexp) 方法在字符串 str 中找到匹配 regexp 的字符

如果 regexp 不帶有 g 標記，則它以數(shù)組的形式返回第一個匹配項，其中包含分組和屬性 index（匹配項的位置）、input（輸入字符串，等于 str）

如果 regexp 帶有 g 標記，則它將所有匹配項的數(shù)組作為字符串返回，而不包含分組和其他詳細信息

如果沒有匹配項，則無論是否帶有標記 g ，都將返回 null

str.matchAll(regexp)

返回一個包含所有匹配正則表達式的結(jié)果及分組捕獲組的迭代器

str.search(regexp)

返回第一個匹配項的位置，如果未找到，則返回 -1，這里需要注意的是，search 僅查找第一個匹配項

str.replace(regexp)

替換與正則表達式匹配的子串，并返回替換后的字符串。在不設置全局匹配g的時候，只替換第一個匹配成功的字符串片段

str.split(regexp)

使用正則表達式（或子字符串）作為分隔符來分割字符串

regexp.exec(str)

regexp.exec(str) 方法返回字符串 str 中的 regexp 匹配項，與以前的方法不同，它是在正則表達式而不是字符串上調(diào)用的，根據(jù)正則表達式是否帶有標志 g，它的行為有所不同

如果沒有 g，那么 regexp.exec(str) 返回的第一個匹配與 str.match(regexp) 完全相同

如果有標記 g，調(diào)用 regexp.exec(str) 會返回第一個匹配項，并將緊隨其后的位置保存在屬性regexp.lastIndex 中。 下一次同樣的調(diào)用會從位置 regexp.lastIndex 開始搜索，返回下一個匹配項，并將其后的位置保存在 regexp.lastIndex 中

regexp.test(str)

查找匹配項，然后返回 true/false 表示是否存在

附：斷言例子

?=匹配一個字符串，該字符串后面跟著一個特定的子字符串：

/Roger(?=Waters)/ 
/Roger(?= Waters)/.test('Roger is my dog') //false 
/Roger(?= Waters)/.test('Roger is my dog and Roger Waters is a famous musician') //true

?! 執(zhí)行逆操作，匹配一個字符串，該字符串后面沒有一個特定的子字符串：

/Roger(?!Waters)/
/Roger(?! Waters)/.test('Roger is my dog') //true
/Roger(?! Waters)/.test('Roger Waters is a famous musician') //false

先行斷言(lookahead)使用 ?= 符號。它們已經(jīng)可用了。

后行斷言(lookbehind)，是一個新功能，使用 ?< =。

/(?<=Roger) Waters/
/(?<=Roger) Waters/.test('Pink Waters is my dog') //false
/(?<=Roger) Waters/.test('Roger is my dog and Roger Waters is a famous musician') //true

后行斷言(lookbehind) 逆操作，使用 ?<!。

/(?<!Roger) Waters/
/(?<!Roger) Waters/.test('Pink Waters is my dog') //true
/(?<!Roger) Waters/.test('Roger is my dog and Roger Waters is a famous musician') //false

總結(jié)

到此這篇關(guān)于前端使用正則表達式進行校驗的文章就介紹到這了,更多相關(guān)前端正則表達式校驗內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！