js的正则表达式语法(js中正则表达式的使用) 收藏 0

JS正则表达式

学习目标：

节数知识点要求第一节 什么是正则表达式什么是正则表达式了解正则表达式语法了解第二节 正则表达式进阶修饰符掌握检索模式掌握RegExp对象掌握第三节 正则表达式高级正则表达式高级掌握

一、正则表达式1.1 正则表达式概述

按照一定的规则，查找和替换字符串。

正则表达式概念：

正则表达式(英文为regular Expression)是一种【字符串检索模式】

正则表达式具体表现为一个字符串的样子。

正则表达式执行原理是：

通过【参数字符串】设置检索规则，在【指定字符串】中检索符合规则的字符串。

正则表达式的作用是：

可以用来进行文本搜索和文本替换。

1.2 正则表达式基本语法

正则表达式的基本语法

语法：/正则表达式主体/修饰符(可选)

例如：var frk_reg = /frank/gi;

其中

(1)/frank/i是一个正则表达式

(2)frank是这个正则表达式的主体，表示想要检索的内容是frank

(3)i 是一个正则表达式的修饰符，表示检索内容时不区分大小写

1.3 正则表达式常见用法

正则表达式在实际开发中一般不会单独使用，而是会配合一些方法来完成某种功能。

因为正则表达式的作用是对字符串进行操作，所以一般在实际开发中正则表达式会配合字符串的search和replace方法来使用。

1.3.1 search方法

search方法用于检索与正则表达式相匹配的子字符串，并返回子字符串的起始位置。找不到是-1

例如：

在指定字符串中，通过正则表达式搜索目标子字符串。并且不区分大小写。

var str = ‘Hello Frank! GoodBye Frank!’;

var first_index = str.search(/frank/i);

console.log(first_index);

1.3.2 match方法

match() 方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。

返回值存放匹配结果的数组

var str = ‘Hello Frank! GoodBye Frank!’;var first_index = str.match(/frank/gi);console.log(first_index);

1.3.3 replace方法

replace方法：用于在指定字符串中用一个字符串替换一个与正则表达式相匹配的子字符串

例如：

在指定字符串中，通过正则表达式替换指定字符串中的目标字符串

var str = ‘Hello Frank! GoodBye Frank!’;

var newStr = str.replace(/frank/i,‘frankenStein’);

console.log(newStr);

很显然replace方法的作用是替换第一个匹配到的字符串，所以我们仅替换了第一个符合规则的Frank。

二、正则表达式进阶2.1 修饰符

修饰符是正则表达式进行字符串检索时【检索规则】的制定者之一。

修饰符规定了正则应按照何种方式进行检索。

常见的修饰符类型有两种：i 、g

i修饰符，表示正则检索内容时不区分大小写

例如：

使用i修饰符，在str中检索frank出现的第一次下标

var str = ‘Hello Frank! GoodBye Frank!’;

​ var first_index = str.search(/frank/i);

​ console.log(first_index);

​ 代码的执行结果是：6

​ 不使用i修饰符，在str中检索frank出现的第一次下标

​ var str = ‘Hello Frank! GoodBye Frank!’;

var first_index = str.search(/frank/);

console.log(first_index);

​ 代码的执行结果是：-1

g修饰符，表示正则检索内容时采用全局匹配，而不是找到第一个就停止。

例如：

使用g修饰符，在str中替换所有的Frank为frankenStein

var str = ‘Hello Frank! GoodBye Frank!’;

var newStr = str.replace(/frank/gi,‘frankenStein’);

console.log(newStr);

代码的执行结果是：Hello frankenStein! GoodBye frankenStein!

不使用g修饰符，在str中替换所有的Frank为frankenStein

​ var str = ‘Hello Frank! GoodBye Frank!’;

​ var newStr = str.replace(/frank/i,‘frankenStein’);

​ console.log(newStr);

​ 代码的执行结果是：Hello frankenStein! GoodBye Frank!

2.2 检索模式

正则表达式的检索模式，用于指定正则采用何种方式进行内容的检索。

常见的检索模式有表达式模式、元字符模式和量词模式三种。

他们并不互相独立而是相辅相成的关系，就像修饰符可以多个一起使用一样。

2.2.1表达式模式

正则表达式的书写方式是通过表达式编写的模式称为表达式模式。

常见的表达式模式有以下三种:

​ a) [abc]

​ b) [0-9]

​ c) [m|n]

每一种模式中的内容都是表示一类值，而不是字面的含义。

一个方括号代表一个字符。

[abc]：在指定字符串中检索，查找任何满足【存在于方括号中】规则的字符或字符串。

例如：

在str中替换所有:只要满足【是a、b当中之一】的字符为(frank)

var str = ‘12abc12ABC’;

var newStr = str.replace(/[ab]/gi,’(frank)’);

console.log(newStr);//12(frank)(frank)c12(frank)(frank)C

正则不只是能替换英文，对于中文正则仍然生效

var str = ‘你好，弗兰克！再见，弗兰克！’;

var newStr = str.replace(/[弗兰克]/g,’(frank)’);

console.log(newStr);//你好，(frank)(frank)(frank)！再见，(frank)(frank)(frank)！

正则匹配字符串时采用多个方括号即可

var str = ‘你好，弗兰克！再见，弗兰克！’;

var newStr = str.replace(/[弗][兰][克]/g,’(frank)’);

console.log(newStr);//你好，(frank)！再见，(frank)！

[0-9]:在指定字符串中检索，查找任何满足【0至9之间】规则的的字符或字符串。该模式对字母也适用。

例如：在str中替换所有：【任意是0-9之间之一】的字符为(frank)

var str = ‘12abc12ABC’;

var newStr = str.replace(/[0-9]/gi,’(frank)’);

console.log(newStr);//(frank)(frank)abc(frank)(frank)ABC

在str中替换所有：【任意是a-z之间之一】的字符为(frank)

var str = ‘12abc12ABC’;

var newStr = str.replace(/[a-z]/g,’(frank)’);

console.log(newStr);//12(frank)(frank)(frank)12ABC

在str中替换所有：【任意是A-Z之间之一】的字符为(frank)

​ var str = ‘12abc12ABC’;

​ var newStr = str.replace(/[A-Z]/g,’(frank)’);

console.log(newStr);//12abc12(frank)(frank)(frank)

(x|y)：在指定字符串中检索，查找任何满足【以|分隔的选项之一】的字符或字符串。

例如：

在str中替换所有：【ab或者是ABC字符串】为’(frank)’

var str = ‘12abc12abABC’;

var newStr = str.replace(/(ab|ABC)/g,’(frank)’);

console.log(newStr);//12(frank)c12(frank)(frank)

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-yQoRsvHS-1608536259202)(020901JS正则表达式.assets/clip_image012.png)]

ps:需要注意的是，如果使用|进行正则查找，则使用的是小括号。而不是中括号

2.2.2元字符模式

​ 元字符：具有特殊含义的字符称为元字符。

​ 通过元字符来进行正则检索的模式，称为元字符模式。

常见的元字符模式有以下三种:

a) \\w

b) \\d

​ c) \\s

​ d) \\b

一个元字符代表一个字符。

\\w 元字符用于查找字母，数字，下划线。

a-z、A-Z、0-9，以及下划线。

var *str* = ‘$12abc12a@@*(*bABC’;var *re* = *str*.match(/\\w/g);*console*.log(*re*);

\\W:除了字母，数字，下划线

\\d：在指定字符串中检索，查找任何【是数字】规则的字符或字符串。

例如：

var str = ‘12abc12abABC’;

var newStr = str.replace(/\\d/g,’(frank)’);

console.log(newStr);//(frank)(frank)abc(frank)(frank)abABC

var str = ‘12abc12abABC’;

var newStr = str.replace(/\\d\\d/g,’(frank)’);

console.log(newStr);//(frank)abc(frank)abABC

\\D：除了数字的

\\s: 在指定字符串中检索，查找任何【是空白】规则的字符或字符串

例如：

var str = ’ 12abc 12ab ABC \’;

var newStr = str.replace(/\\s/g,’(frank)’);

console.log(newStr);//(frank)12abc(frank)12ab(frank)ABC(frank)

var str = ’ 12abc 12ab ABC \’;

var newStr = str.replace(/\\s\\s/g,’(frank)’);

console.log(newStr);// 12abc 12ab ABC

\\S:除了空白的字符

\\b: 在指定字符串中检索，查找任何【是单词边界】规则的字符或字符串

JavaScript全解析——正则表达式

●正则也叫正则表达式，又名 “规则表达式”●正则是JS中的数据类型, 是一个复杂数据类型●由我们自己来书写 “规则”，专门用来检测 字符串 是否符合 “规则” 使用的●我们使用一些特殊的字符或者符号定义一个 “规则公式”，然后用我们定义好的 “规则公式” 去检测字符串是不是合格

●上面的变量 reg 就是定制好的规则●检测 str1 这个字符串的时候，符合规则●检测 str2 这个字符串的时候，不符合规则

创建一个正则表达式●想制定 “规则”，必须要按照人家要求的方式来制定●把一些字母和符号写在 // 中间的东西，叫做正则表达式，比如 /abcdefg/●创建正则表达式有两个方式 字面量 和 构造函数创建

字面量创建

●这个正则表达式就可以去检测字符串了●这个正则表达式的意义是字符串中的必须要包含\’abcdefg\’这个片段

构造函数创建

●使用构造函数方式创建的和字面量创建的，得到的结果一样

两种创建方式的区别●语法不一样●书写标识符的时候○字面量方式直接书写在正则的后面○内置构造函数, 以第二个参数的方式传递●拼接字符串○字面量方式不接受拼接字符串○内置构造函数方式, 可以拼接字符串●基本元字符书写○字面量方式的时候, 直接书写 \\s\\d\\w○内置构造函数书写的时候, 需要书写 \\s\\d\\w

正则表达式的方法

●正则提供了一些方法给我们使用●用来检测和捕获字符串中的内容的test()方法——匹配●作用：test方法是用来检测字符串是否符合我们正则的标准●语法： 正则.test(字符串)●返回值： boolean○如果该字符串符合正则的规则, 那么就是 true○如果该字符串不符合正则的规则, 那么就是 false

exec()方法——捕获

●作用：exec方法是把字符串中满足条件的内容捕获出来●语法： 正则.exec(字符串)●返回值： 把字符串中符合正则要求的第一项以及一些其他信息，以数组的形式返回○原始字符串中没有符合正则要求的字符串片段■null○原始字符串中有符合正则要求的片段■正则没有 () 也没有 全局标识符g●返回值是一个数组●索引 0 是从字符串中捕获出来的满足正则条件的第一个内容●注意: 不管捕获多少次, 每次都是从原始字符串的索引 0 开始检索■正则有全局标识符 g●返回值是一个数组●索引 0 是从字符串中捕获出来的满足正则条件的第一个内容●注意: 第二次捕获是从第一次的结束位置开始向后查询, 直到最后捕获不到为止, 再下一次的时候, 又从字符串的 索引0 开始检索■有 ()●返回的是一个数组●索引 0 是从字符串中捕获出来的满足正则条件的第一个内容●从索引 1 开始, 依次是每一个小括号的单独内容●注意: 按照小括号的开始标志, 来数是第几个小括号

●扩展: () 有两个意义○一个整体○单独捕获○如果你想只使用一个意义, 整体的所用, 不想在捕获的时候单独捕获出来○你可以写成 (?:)表示匹配但不捕获

正则表达式里面的符号

●知道了怎么创建一个正则表达式以后，我们就来详细的说一下正则表达式里面涉及到的一些符号了元字符基本元字符●. ： 匹配非换行的任意字符 表示字符串中至少要有一个非换行的内容●\\ ： 转译符号，把有意义的 符号 转换成没有意义的 字符，把没有意义的 字符 转换成有意义的 符号●\\s ： 匹配空白字符（空格/缩进/制表符/…）表示字符串中至少包含一位 空白 内容●\\S ： 匹配非空白字符●\\d ： 匹配数字 表示字符串中至少包含一位 数字(0-9)●\\D ： 匹配非数字 表示字符串中至少包含一位 非数字 内容●\\w ： 匹配数字字母下划线 表示 一位 数字(0-9)字母(a-zA-Z)下划线(_) 中的任意一个●\\W ： 匹配非数字字母下划线 表示 一位 非数字字母下划线 中的任意一个●有了元字符我们就可以简单的制定一些规则了

限定符注意: 一个限定符只能修饰符号前面的一个内容的出现次数●* ： 前一个内容重复至少 0 次，也就是可以出现 0 ～ 正无穷 次●+ ： 前一个内容重复至少 1 次，也就是可以出现 1 ～ 正无穷 次●? ： 前一个内容重复 0 或者 1 次，也就是可以出现 0 ～ 1 次●{n} ： 前一个内容重复 n 次，也就是必须出现 n 次●{n,} ： 前一个内容至少出现 n 次，也就是出现 n ～ 正无穷 次●{n,m} ： 前一个内容至少出现 n 次至多出现 m 次，也就是出现 n ～ m 次●限定符是配合元字符使用的

边界符●^ ： 表示开头●$ ： 表示结尾●边界符是限定字符串的开始和结束的

特殊符号●() ： 限定一组元素●[] ： 字符集合，表示写在 [] 里面的任意一个都行●[^] ： 反字符集合，表示写在 [^] 里面之外的任意一个都行●- ： 范围，比如 a-z 表示从字母 a 到字母 z 都可以●| ： 或，正则里面的或 a|b 表示字母 a 或者 b 都可以●现在我们就可以把若干符号组合在一起使用了

标识符(修饰符)●书写在正则表达式的外面, 专门用来修饰整个正则表达式的符号●i ：ignore的简写 表示忽略大小写○这个 i 是写在正则的最后面的○/\\w/i○就是在正则匹配的时候不去区分大小写●g ： global的简写 表示全局匹配○这个 g 是写在正则的最后面的○/\\w/g○就是全局匹配字母数字下划线

字符串和正则合用的方法

●字符串中有一些方法也是可以和正则一起使用的search●作用：search 是查找字符串中是否有满足正则条件的内容●语法：○字符串.search(正则)○字符串.search(字符串片段)●返回值 ： 有的话返回开始索引，没有返回 -1

match

●作用：match 找到字符串中符合正则条件的内容返回●语法：○字符串.match(正则)○字符串.match(字符串片段)●返回值 ：○没有标示符 g 的时候，是和 exec 方法一样○有标示符 g 的时候，是返回一个数组，里面是匹配到的每一项

replace

●作用：replace 是将字符串中满足正则条件的字符串替换掉●语法：○字符串.replace(\’换下字符\’, \’换上字符\’)○字符串.replace(正则表达式, \’换上字符\’)●返回值 ： 替换后的字符串○当你的第一个参数传递字符串的时候, 只能替换一个○当你的第一个参数传递正则表达式的时候, 只能替换一个○但是如果你的正则表达式有全局标识符 g, 那么有多少替换多少

案例——密码强度校验

案例——表单验证

正则预查(扩展)正向预查●正向肯定预查:(?=)●正向否定预查:(?!)负向预查●负向肯定预查:(?<=)●负向否定预查:(?<!)

JavaScript 正则表达式详解大全

JavaScript中的正则表达式是一种强大的文本处理工具，它通过定义字符模式来匹配字符串中的特定部分。以下是关于JavaScript正则表达式的详细解释

• 正则表达式（Regular Expression）：用于描述字符模式的对象，用于在字符串中查找、替换或提取符合某种规则的子串。
• 元字符（Metacharacters）：在正则表达式中有特殊含义的字符，如.、*、+等。

• 字面量方式：使用斜杠包围表达式，如/pattern/flags，例如/hello/i表示忽略大小写匹配“hello”。
• 构造函数方式：使用new RegExp()构造函数，如new RegExp(\”hello\”, \”i\”)。

• **test()**：测试字符串是否满足正则表达式规则，返回布尔值。
• **search()**：执行搜索匹配，返回第一个匹配项的索引位置，找不到返回-1。
• **exec()**：在一个指定字符串中执行搜索匹配，返回一个结果数组或null。
• **match()**：检索字符串并返回匹配的结果，可以与全局标志一起使用。
• **replace()**：返回一个新字符串，其中的某些部分被替换为新的子字符串。

• g：global，全文搜索。
• i：ignore case，忽略大小写。
• m：multiple lines，多行搜索。
• 其他标志符：如s（允许.匹配换行符）、u（使用Unicode码进行匹配）等。

• 正向肯定查找（(?=…)）：匹配前面的内容，同时要求后面的条件也成立。
• 正向否定查找（(?!…)）：匹配前面的内容，但后面不能是指定的条件。
• 反向肯定查找（(?<=…)）：匹配后面的内容，但前面的条件必须成立。
• 反向否定查找（(?<!…)）：匹配后面的内容，但前面的条件不能成立。

• 分组：使用圆括号()将正则表达式的一部分括起来，形成分组。
• 反向引用：在模式后面引用分组匹配的内容。

以上是关于JavaScript正则表达式的详细解释和示例代码。希望这些信息能帮助你更好地理解和使用JavaScript中的正则表达式。

本文作者及来源:Renderbus瑞云渲染农场https://www.renderbus.com