资讯专栏INFORMATION COLUMN

JavaScript中的正则表达式

_Zhao / 1404人阅读

Javascript的正则表达式是前端中比较重要的部分,正则表达式主要用于字符串处理,表单验证等场合,实用高效,文章主要对JavaScript中的正则的学习与总结

正则表达式的定义

正则表达式:是一个描述字符模式的对象,JavaScrip中正则表达式用RegExp对象表示,可以使用RegExp构造函数来创建正则对象

正则表达式的创建
1.字面量创建

var reg = /[a-z]/;

2.构造函数的创建

var reg = new RegExp("[a-z]");
直接量字符

字符类

将直接量字符放入方括号内就组成了字符类

console.log(/[abc]/.test("a"));//true
console.log(/[abc]/.test("b"));//true
console.log(/[abc]/.test("c"));//true
否定类字符

定义否定类字符时,将一个“^”符号作为方括号内的第一个字符

console.log(/[^abc]/.test("a"));//false
console.log(/[^abc]/.test("b"));//false
console.log(/[^abc]/.test("1111"));//true
范围字符

利用 "-" 表示范围字符,可以匹配某个范围内的字符

 console.log(/[0-9]/.test("5"));//true
 console.log(/[0-9]/.test("a"));//false
 console.log(/[a-z]/.test("b"));//true
 console.log(/[a-z]/.test("B"));//false
 console.log(/[A-Z]/.test("B"));//true
 console.log(/[A-Z]/.test("b"));//false

预定义的字符类

量词

在我们上面认识到的正则语法当中,我们可以把两位字母描述为/ww/,三位字母描述为/www/,但如果要描述很多位字母怎么办?描述为/w....../天呐! 这是要逼死我们的节奏啊!因此量词就是处理这些数量关系操作的它用来修饰前一位字符出现的次数

console.log(/d{2,4}/.test("111"));//true
console.log(/w{3}d?/.test("aaa"));//true
console.log(/w{3}d?/.test("aaa1"));//true

注意:在使用 " " 和 " ? " 时 由于这些字符有可能匹配0个字符,因此他们允许什么都不匹配,例如,正则表达式 /a/与"bbbb"匹配,因为它含有0个a

贪婪量词

我们上面列出的量词都是贪婪量词,

它会尽可能多地匹配,默认先匹配整个字符串,然后不匹配在缩小范围继续匹配

非贪婪量词

在上面列出的量词后面加个问号(" ?? " " +? ")

总是从第一个字符开始向后扩展范围匹配

//非贪婪模式
console.log(/a*?bb/g.exec("abbaabbaaabbb")); //abb
//贪婪模式
var pattern = /a*bb/g;
var text = "aabbaabbaaabbbaabbb";
var result;
while((result = pattern.exec(text))!=null){
    console.log(result); //aabb aabb aaabb aabb
}
选择,分组与引用

选择

字符 " | " 用于分隔供选择的字符

console.log(/ab|cd|ef/.test("ab"));//true
console.log(/ab|cd|ef/.test("cd"));//true
console.log(/ab|cd|ef/.test("ef"));//true

分组

"()" 用于分组,把多带带的项组合成子表达式

console.log(/java(script)?/.test("java"));//true
console.log(/java(script)?/.test("javascript"));//true

引用

引用包含 匹配模式引用,匹配的内容引用

" "后面加数字 用于模式的引用

" $ " 后面加数据 用于匹配的内容引用

console.log(/(d)([a-z])1/.test("1a1"));//true
console.log(RegExp.$1);//1
console.log(RegExp.$2);//a

只组合并不创建引用

并不是所有的分组都能创建引用," (?: ) "符号只用来分组而不创建引用,如下: 1 不是 引用的 d 而是 [a-z]

console.log(/(?:d)([a-z])1/.test("1aa"));//true
console.log(/(?:d)([a-z])1/.test("1a1"));//false
位置字符

console.log(/^java$/.test("java"));//true
console.log(/^java$/.test("javascript"));//false
console.log(/^java$/.test("cjavascript"));//false
console.log(/java(?=script)/.test("javascript"));//true
console.log(/java(?=script)/.test("javaislan"));//false
console.log(/java(?!script)/.test("javascript"));//false
console.log(/java(?!script)/.test("javaislan"));//true 
修饰符

正则表达式的修饰符是放在 "/" 之外的,JavaScript 支持三个修饰符

console.log(/JAVA/i.test("java"));//true


支持正则的String对象方法

search():
用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串,并返回第一个与之匹配的子字符串的位置

console.log("JAVA is not javascript".search(/java/i));//0

注意:search()方法不支持全局检索,因为他会忽略正则表达式参数中的修饰符g

replace():

用于检索与替换操作,接收两个参数,第一个是正则表达式,第二个是要进行替换的字符串,该方法可以全局匹配

console.log("JAVA is not JAVAscript".replace(/java/i, "java"));//java is not JAVAscript
console.log("JAVA is not JAVAscript".replace(/java/ig, "java"));//java is not javascript

回忆上面我们所提到的正则的引用 $加数字可以保存分组的匹配的内容,这里我们就可以用到

console.log("JAVA is not javascript".replace(/(JAVA)/, ""$1""));//"JAVA" is not javascrip


match():

用于检索字符串中与正则表达式匹配的结果,参数必须是正则表达式,返回一个由匹配结果组成的数组

在match方法中如果正则表达式设置修饰符g,则返回的数组是字符串中所有匹配的结果

console.log("JAVA is not JAVAscript".match(/java/ig));//["JAVA", "JAVA"]

如果没有设置g,match()方法不会进行全局检索,只会检索第一个匹配,但它也是返回一个数组,此时数组的第一个元素就是匹配的结果,剩下的元素为圆括号包含的子表达式匹配的结果

 console.log("1a2b".match(/(d)([a-z])/)); //["1a", "1", "a"]


split():
用于把一个字符串分割成数组,参数为字符串或这个正则表达式

console.log("a,b,c,d".split(","));//["a", "b", "c", "d"]
console.log("a, b, c, d".split(/,s*/));//["a", "b", "c", "d"]
JavaScript中的 RegExp 对象

RegExp() 构造函数用于创建新的RegExp 对象。构造函数接受两个参数,第一个是表达式的主体部分,第二个是表达式的修饰符

//在构造函数中必须用  字符作为前缀进行转义
var regExp = new RegExp("w*", "g");


RegExp 对象的属性

RegExp 对象包含5个属性

RegExp对象的方法

exec():

用于检索字符串中正则表达式的匹配,如果有匹配则返回该匹配的值,否则返回null

console.log(/java/i.exec("javaScript is not java"));//["java", index: 0, input: "javaScript is not java"]
console.log(/css/i.exec("javaScript is not java"));//null
console.log(/java/ig.exec("javaScript is not java"));//["java", index: 0, input: "javaScript is not java"]


上述代码可以看出exec() 只会返回一次匹配结果,在全局匹配模式下,exec方法会设置lastIndex 属性的值,exec()的下次检索会从lastIndex属性指示的字符处开始检索

var pattern = /java/ig;
var text = "javaScript is not JAVA";
var result;
result = pattern.exec(text);
console.log(result);//["java", index: 0, input: "javaScript is not java"]
console.log(pattern.lastIndex);//4
result = pattern.exec(text);
console.log(result);//["JAVA", index: 18, input: "javaScript is not JAVA"]
console.log(pattern.lastIndex);//22

通常我们在用exec()检索字符串时,可以利用while循环

var pattern = /java/ig;
var text = "javaScript is not JAVA";
var result;
while((result = pattern.exec(text))!==null){
    console.log(result);
}
 

test():

用于检索字符串中是否匹配某个表达式,如果匹配返回true,否则返回false

console.log(/java/.test("javascript"));//true
console.log(/java/.test("script"));//true

关注微信公众号:六小登登。领取全套学习资源

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/89243.html

相关文章

  • JavaScript正则达式的匹配模式

    摘要:选择分组和引用正则表达式的语法还包括指定选择项子表达式分组和引用前一子表达式的特殊字符。带圆括号的表达式的另一个用途是允许在同一正则表达式的后部引用前面的子表达式。 正则表达式(regular expression)是一个描述字符模式的对象。JavaScript的 RegExp类 表示正则表达式,String和RegExp都定义了方法,后者使用正则表达式进 行强大的模式匹配和文本检索与...

    wqj97 评论0 收藏0
  • JavaScript 中的正则达式

    摘要:正则表达式的意义中的正则表达式使用表示,可以使用构造函数来创建对象,不过对象更多的是通过一种特殊的直接量语法来创建。用构造函数也可以定义一个与之等价的正则表达式,代码如下正则表达式的模式规则是由一个字符序列组成的。 正则表达式的模式匹配 正则表达式(regular expression)是一个描述字符模式的对象。javascript的RegExp对象表示正则表达式,String和Reg...

    _Dreams 评论0 收藏0
  • JS中的正则达式

    摘要:构造函数可以有两个字符串参数,第一个参数包含正则表达式的主体部分。只读的布尔值,说明这个正则表达式是否带有修饰符。中正则的扩展构造函数在中,只能接受字符串作为参数,允许其直接接受正则表达式作为参数。 上文传送门:初探正则表达式 正则表达式是一个描述字符模式的对象,JavaScript 的 RegExp 类表示正则表达式,String 和 RegExp 都定义了方法,后者使用正则表达式进...

    Soarkey 评论0 收藏0
  • 正则达式

    摘要:本文内容共正则表达式火拼系列正则表达式回溯法原理学习正则表达式,是需要懂点儿匹配原理的。正则表达式迷你书问世了让帮你生成和解析参数字符串最全正则表达式总结验证号手机号中文邮编身份证地址等是正则表达式的缩写,作用是对字符串执行模式匹配。 JS 的正则表达式 正则表达式 一种几乎可以在所有的程序设计语言里和所有的计算机平台上使用的文字处理工具。它可以用来查找特定的信息(搜索),也可以用来查...

    bang590 评论0 收藏0
  • JavaScript 闯关记》之正则达式

    摘要:正则表达式的字符串表示,按照字面量形式而非传入构造函数中的字符串模式返回。其中,表示匹配项在字符串中的位置,而表示应用正则表达式的字符串。下面列出了正则表达式所不支持的特性。关卡按要求完成下列常用的正则表达式。 由于本课程的核心是 JavaScript,所以本文着重讲解了「正则表达式」在 JavaScript 中的用法,并未深入「正则表达式」的具体细节。如果您尚不了解「正则表达式」,强...

    TalkingData 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<