正则表达式从入门到摸鱼(本文内容过长,先给阿姨来一杯卡布奇诺再阅读)

一、简介

除非您以前使用过正则表达式,否则您可能不熟悉此术语。但是,毫无疑问,您已经使用过不涉及脚本的某些正则表达式概念。

例如,您很可能使用 ? 和 * 通配符来查找硬盘上的文件。通配符匹配文件名中的单个字符,而 * 通配符匹配零个或多个字符。像 data?.dat 这样的模式将查找下列文件:

data1.dat
data2.dat
datax.dat
dataN.dat

使用 * 字符代替 ? 字符扩大了找到的文件的数量。data*.dat 匹配下列所有文件:

data.dat
data1.dat
data2.dat
data12.dat
datax.dat
dataXYZ.dat

尽管这种搜索方法很有用,但它还是有限的。通过理解 * 通配符的工作原理,引入了正则表达式所依赖的概念,但正则表达式功能更强大,而且更加灵活。

正则表达式的使用,可以通过简单的办法来实现强大的功能。下面先给出一个简单的示例:

 ^.+@.+\\..+$ 

1、为什么使用正则表达式?

典型的搜索和替换操作要求您提供与预期的搜索结果匹配的确切文本。虽然这种技术对于对静态文本执行简单搜索和替换任务可能已经足够了,但它缺乏灵活性,若采用这种方法搜索动态文本,即使不是不可能,至少也会变得很困难。

通过使用正则表达式,可以:

  • 测试字符串内的模式。
    例如,可以测试输入字符串,以查看字符串内是否出现电话号码模式或信用卡号码模式。这称为数据验证。
  • 替换文本。
    可以使用正则表达式来识别文档中的特定文本,完全删除该文本或者用其他文本替换它。
  • 基于模式匹配从字符串中提取子字符串。
    可以查找文档内或输入域内特定的文本。

例如,您可能需要搜索整个网站,删除过时的材料,以及替换某些 HTML 格式标记。在这种情况下,可以使用正则表达式来确定在每个文件中是否出现该材料或该 HTML 格式标记。此过程将受影响的文件列表缩小到包含需要删除或更改的材料的那些文件。然后可以使用正则表达式来删除过时的材料。最后,可以使用正则表达式来搜索和替换标记。

2、发展历史

正则表达式的"祖先"可以一直上溯至对人类神经系统如何工作的早期研究。Warren McCulloch 和 Walter Pitts 这两位神经生理学家研究出一种数学方式来描述这些神经网络。

1956 年, 一位叫 Stephen Kleene 的数学家在 McCulloch 和 Pitts 早期工作的基础上,发表了一篇标题为"神经网事件的表示法"的论文,引入了正则表达式的概念。正则表达式就是用来描述他称为"正则集的代数"的表达式,因此采用"正则表达式"这个术语。

随后,发现可以将这一工作应用于使用 Ken Thompson 的计算搜索算法的一些早期研究,Ken Thompson 是 Unix 的主要发明人。正则表达式的第一个实用应用程序就是 Unix 中的 qed 编辑器。

如他们所说,剩下的就是众所周知的历史了。从那时起直至现在正则表达式都是基于文本的编辑器和搜索工具中的一个重要部分。

3、应用领域

目前,正则表达式已经在很多软件中得到广泛的应用,包括 *nix(Linux, Unix等)、HP 等操作系统,PHP、C#、Java 等开发环境,以及很多的应用软件中,都可以看到正则表达式的影子。

二、JavaScript RegExp 对象

1、RegExp 对象

正则表达式是描述字符模式的对象。

正则表达式用于对字符串模式匹配及检索替换,是对字符串执行模式匹配的强大工具。

2、语法

var aaa = new RegExp(pattern,modifiers);

或者更简单的方式:

var aaa = /pattern/modifiers;
  • pattern(模式) 描述了表达式的模式
  • modifiers(修饰符) 用于指定全局匹配、区分大小写的匹配和多行匹配

注意:当使用构造函数创造正则对象时,需要常规的字符转义规则(在前面加反斜杠 \)。比如,以下是等价的:

var re = new RegExp("\\w+");
var re = /\w+/;

3、修饰符

修饰符用于执行区分大小写和全局匹配:

修饰符 描述
i 执行对大小写不敏感的匹配。
g 执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)。
m 执行多行匹配。
定义和用法

i 修饰符用于执行对大小写不敏感的匹配。

语法
new RegExp("regexp1","i")
new RegExp("regexp2","g")

或者更简单方式:

/regexp1/i
/regexp2/g
浏览器支持

在这里插入图片描述
所有主要浏览器都支持 i 修饰符。

4、方括号

方括号用于查找某个范围内的字符:

表达式 描述
[abc] 查找方括号之间的任何字符。
[^abc] 查找任何不在方括号之间的字符。
[0-9] 查找任何从 0 至 9 的数字。
[a-z] 查找任何从小写 a 到小写 z 的字符。
[A-Z] 查找任何从大写 A 到大写 Z 的字符。
[A-z] 查找任何从大写 A 到小写 z 的字符。
[adgk] 查找给定集合内的任何字符。
[^adgk] 查找给定集合外的任何字符。
(red/blue/green) 查找任何指定的选项。
语法
new RegExp("[abc]")

或者更简单方式:

/[abc]/

5、元字符

元字符 描述
. 查找单个字符,除了换行和行结束符。
\w 查找单词字符。
\W 查找非单词字符。
\d 查找数字。
\D 查找非数字字符。
\s 查找空白字符。
\S 查找非空白字符。
\b 匹配单词边界。
\B 匹配非单词边界。
\0 查找 NUL 字符。
\n 查找换行符。
\f 查找换页符。
\r 查找回车符。
\t 查找制表符。
\v 查找垂直制表符。
\xxx 查找以八进制数 xxx 规定的字符。
\xdd 查找以十六进制数 dd 规定的字符。
\uxxxx 查找以十六进制数 xxxx 规定的 Unicode 字符。

6、量词

量词 描述
n+ 匹配任何包含至少一个 n 的字符串。
n* 匹配任何包含零个或多个 n 的字符串。
n? 匹配任何包含零个或一个 n 的字符串。
n{X} 匹配包含 X 个 n 的序列的字符串。
n{X,Y} 匹配包含 X 至 Y 个 n 的序列的字符串。
n{X,} 匹配包含至少 X 个 n 的序列的字符串。
n$ 匹配任何结尾为 n 的字符串。
^n 匹配任何开头为 n 的字符串。
?=n 匹配任何其后紧接指定字符串 n 的字符串。
?!n 匹配任何其后没有紧接指定字符串 n 的字符串。

7、RegExp 对象方法

方法 描述 FF IE
compile 编译正则表达式。 1 4
exec 检索字符串中指定的值。返回找到的值,并确定其位置。 1 4
test 检索字符串中指定的值。返回 true 或 false。 1 4
① JavaScript compile() 方法
  • 定义和用法
    compile() 方法用于在脚本执行过程中编译正则表达式。

compile() 方法也可用于改变和重新编译正则表达式。

  • 语法
RegExpObject.compile(regexp,modifier)
参数 描述
regexp 正则表达式。
modifier 规定匹配的类型。“g” 用于全局匹配,“i” 用于区分大小写,“gi” 用于全局区分大小写的匹配。
  • 浏览器支持
    在这里插入图片描述
    除了 Opera 浏览器外,其他浏览器都支持 compile() 方法。

  • 实例

在字符串中全局搜索 “man”,并用 “person” 替换。然后通过 compile() 方法,改变正则表达式,用 “person” 替换 “man” 或 “woman”


var str="Every man in the world! Every woman on earth!";
var patt=/man/g;
var str2=str.replace(patt,"person");
document.write(str2+"
"
); patt=/(wo)?man/g; patt.compile(patt); str2=str.replace(patt,"person"); document.write(str2);

输出结果:

Every person in the world! Every woperson on earth!
Every person in the world! Every person on earth!
② JavaScript exec() 方法
  • 定义和用法
    exec() 方法用于检索字符串中的正则表达式的匹配。

如果字符串中有匹配的值返回该匹配值,否则返回 null。

  • 语法
RegExpObject.exec(string)
参数 描述
string Required. The string to be searched
  • 浏览器支持
    在这里插入图片描述
    所有主要浏览器都支持 exec() 方法

  • 实例

在字符串中全局搜索 “Hello” 字符串


var str="Hello world!";
//look for "Hello"
var patt=/Hello/g;
var result=patt.exec(str);
document.write("Returned value: " + result);

输出结果:

Returned value: Hello
③ JavaScript test() 方法
  • 定义和用法
    test() 方法用于检测一个字符串是否匹配某个模式.

如果字符串中有匹配的值返回 true ,否则返回 false。

  • 语法
RegExpObject.test(string)
参数 描述
string 必需。要检测的字符串。
  • 浏览器支持
    在这里插入图片描述
    所有主要浏览器都支持 test() 方法

  • 实例

在字符串中全局搜索 “Hello” 字符串


var str="Hello world!";
//look for "Hello"
var patt=/Hello/g;
var result=patt.test(str);
document.write("Returned value: " + result);

输出结果:

Returned value: true

8、支持正则表达式的 String 对象的方法

方法 描述 FF IE
search 检索与正则表达式相匹配的值。 1 4
match 找到一个或多个正则表达式的匹配。 1 4
replace 替换与正则表达式匹配的子串。 1 4
split 把字符串分割为字符串数组。 1 4
① JavaScript search() 方法
  • 定义和用法
    search() 方法用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串。

如果没有找到任何匹配的子串,则返回 -1。

  • 语法
string.search(searchvalue)
  • 参数值
参数 描述
searchvalue 必须。查找的字符串或者正则表达式。
  • 返回值
类型 描述
Number 与指定查找的字符串或者正则表达式相匹配的 String 对象起始位置。
  • 浏览器支持
    在这里插入图片描述
    所有主要浏览器都支持 search() 方法

  • 实例

执行一次对大小写敏感的查找


var str="Mr. Blue has a blue house";
document.write(str.search("blue"));

输出结果:

var str="Mr. Blue has a blue house" document.write(str.search("blue"));

执行一次忽略大小写的检索


var str="Mr. Blue has a blue house";
document.write(str.search(/blue/i));

输出结果:

var str="Mr. Blue has a blue house" document.write(str.search(/blue/i));
② JavaScript match() 方法
  • 定义和用法
    match() 方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。

如果想了解更多正则表达式教程请查看本站的: RegExp 教程 和我们的 RegExp 对象参考手册。

注意: match() 方法将检索字符串 String Object,以找到一个或多个与 regexp 匹配的文本。这个方法的行为在很大程度上有赖于 regexp 是否具有标志 g。如果 regexp 没有标志 g,那么 match() 方法就只能在 stringObject 中执行一次匹配。如果没有找到任何匹配的文本, match() 将返回 null。否则,它将返回一个数组,其中存放了与它找到的匹配文本有关的信息。

  • 语法
string.match(regexp)
参数 描述
regexp 必需。规定要匹配的模式的 RegExp 对象。如果该参数不是 RegExp 对象,则需要首先把它传递给 RegExp 构造函数,将其转换为 RegExp 对象。
  • 返回值
类型 描述
Array 存放匹配结果的数组。该数组的内容依赖于 regexp 是否具有全局标志 g。 如果没找到匹配结果返回 null 。
  • 浏览器支持
    在这里插入图片描述
    所有主要浏览器都支持 match() 方法

  • 实例

全局查找字符串 “ain”,且不区分大小写


var str="The rain in SPAIN stays mainly in the plain";
var n=str.match(/ain/gi);

输出结果:

var str = "The rain in SPAIN stays mainly in the plain"; document.write(str.match(/ain/gi));
③ JavaScript replace() 方法
  • 定义和用法
    replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。
  • 语法
string.replace(searchvalue,newvalue)
参数 描述
searchvalue 必须。规定子字符串或要替换的模式的 RegExp 对象。请注意,如果该值是一个字符串,则将它作为要检索的直接量文本模式,而不是首先被转换为 RegExp 对象。
newvalue 必需。一个字符串值。规定了替换文本或生成替换文本的函数。
  • 返回值
类型 描述
String 一个新的字符串,是用 replacement 替换了 regexp 的第一次匹配或所有匹配之后得到的。
  • 浏览器支持
    在这里插入图片描述
    所有主要浏览器都支持 replace() 方法

  • 实例

执行一个全局替换


var str="Mr Blue has a blue house and a blue car";
var n=str.replace(/blue/g,"red");

输出结果:

Mr Blue has a red house and a red car

执行一个全局替换, 忽略大小写


var str="Mr Blue has a blue house and a blue car";
var n=str.replace(/blue/gi, "red");

输出结果:

Mr red has a red house and a red car
④ JavaScript split() 方法
  • 定义和用法
    split() 方法用于把一个字符串分割成字符串数组。

提示: 如果把空字符串 ("") 用作 separator,那么 stringObject 中的每个字符之间都会被分割。

注意: split() 方法不改变原始字符串。

string.split(separator,limit)
参数 描述
separator 可选。字符串或正则表达式,从该参数指定的地方分割 string Object。
limit 可选。该参数可指定返回的数组的最大长度。如果设置了该参数,返回的子串不会多于这个参数指定的数组。如果没有设置该参数,整个字符串都会被分割,不考虑它的长度。
  • 返回值
类型 描述
Array 一个字符串数组。该数组是通过在 separator 指定的边界处将字符串 string Object 分割成子串创建的。返回的数组中的字串不包括 separator 自身。
  • 浏览器支持
    在这里插入图片描述
    所有主要浏览器都支持 split() 方法

  • 实例

省略分割参数


var str="How are you doing today?";
var n=str.split();

输出结果:

How are you doing today?

分割每个字符,包括空格


var str="How are you doing today?";
var n=str.split("");

输出结果:

H,o,w, ,a,r,e, ,y,o,u, ,d,o,i,n,g, ,t,o,d,a,y,?

使用 limit 参数


var str="How are you doing today?";
var n=str.split(" ",3);

输出结果:

How,are,you

使用一个字符作为分隔符


var str="How are you doing today?";
var n=str.split("o");

输出结果:

H,w are y,u d,ing t,day?

Thank you for your reading !

你可能感兴趣的:(RegExp,javascript,typescript,前端)