by addy 原创文章,欢迎转载,但希望全文转载,注明本文地址。

本文地址:http://www.iamaddy.net/2014/02/javascript%e4%b8%ad%e7%9a%84%e6%ad%a3%e5%88%99%e8%a1%a8%e8%be%be%e5%bc%8f/

在javascript中,String和RegExp都定义了方法,正则表达式的语法是Perl5的正则表达式的一个子集,因此不会完全的支持Perl5的正则表达式语法。定义方式有以下两种:

var pattern = /s$/; // 字面量
var pattern = new RegExp("s$"); // RegExp对象

诸如正则表达式中的直接量字符和元字符,以及基本的语法就不做介绍了,这是最基本的正则表达式知识,本文只针对部分特性进行讨论。

重复

我们知道重复有以下语法支持{},?,+,*,通过他们可以匹配到重复的字符。还有一种重复叫非贪婪重复,也就是尽可能少的匹配,如”??”,”+?”,”*?”。/a+b/可以匹配一个或者多个a,以及一个b,当字符串是aaaab时,能够匹配到整个字符串。但尝试下非贪婪匹配/a+?b/,期望匹配最后一个a和b,但却匹配了整个字符串,这是因为正则表达式的模式匹配总是会寻找字符串中第一个可能匹配的位置。

选择、分组和引用

|,选择,匹配该符号的左边或右边,成功匹配左边后,不在对右边进行匹配。
(…) 分组,子模式匹配,可记忆,供此后的引用使用,匹配成功字符反映在最终的结果中。引用是通过在字符\后加数字来实现的。

/(Java(script)?)\sis\s(powerful)/
// 可以用\2指代(script),计算左括号的位置就能找到指定的表达式

对前一个字表达式的引用,并不是指对字表达式模式的引用,而是与那个模式相匹配的文本的引用,举个例子来说明下:

// 可以匹配的引号有四种组合'sd",'sd',"sd","sd'
/["']\w*["']/
// 引用只有两种组合'sd',"sd"
/(['"])\w*\1/

(?:…)该分组只会组合,不会引用。

锚字符

所谓的锚就是位置,正则表达式匹配位置,^、$比较常用,就不表了。\b匹配一个单词的边界,就是介于\w和\W之间的位置,或者是开头和\w,结尾和\w。相反,\B匹配的是非单词边界位置。正向先行断言和负向先行断言也都是匹配位置的,但不是很常用,用几个例子说明下:

// 能够匹配"Javascript is",不能匹配"javascripts"
/\bJavascript\b/ 
// 正向先行断言,必须匹配Javascript后的;号
/Javascript(?=\;)/
// 负向先行断言,不匹配Javascript后的;号
/Javascript(?!\;)/

String对象的正则方法

  • search(),参数是正则表达式,若不是则先进行转换;忽略修饰符g;返回匹配字符串的起始位置,无匹配返回-1。
  • replace(),检索替换,两参数,第一个是正则,第二个是需替换的字符串或函数;默认非全局替换;返回替换后新的字符串,旧的保持不变。
  • match(),唯一参数是正则表达式;默认非全局匹配;返回数组,无匹配返回null;非全局匹配时,返回结果有input和index属性。
  • split(delimiter, limit),第一个表示切分的字符串或者正则表达式,第二个表示返回数组的长度
"1.2.3.4".split('.') // ["1","2","3","4"]
"|1|2|3|4|".split('.') // ["","1","2","3","4",""]
"1234".split("") // ["1","2","3","4"]
"1234".split("",3) // ["1","2","3"]
// 返回分割标记
"haha<a>".split(/(<[^>]*>)/); // ["haha","<a>","sdd","</a>"]

RegExp对象

  • exec(string),匹配方法最强大的一个,返回匹配的所有信息,无匹配返回null;全局匹配时,从lastIndex开始搜索,找到时设置lastIndex为匹配后的第一个字符位置,重复调用则遍历匹配所有匹配项。
  • test(string),是否匹配,返回boolean值。

以上是javascript中的部分正则表达式的知识,若要写出高效的正则表达式,则需要进一步了解其原理,这里推荐一本书《精通正则表达式(第三版)》(美)佛瑞德,书中结合实例,讲解的非常清晰,能够帮助我们了解到相关原理,需要电子版的请联系我。
最后留一简单的题目,用javascript正则实现:

var str = "hello javascript is fun";
//输出hello3 javascript4 is5 fun6,当然不排除这个字符会更长,欢迎大家来

本文为原创文章,可能会经常更新知识点以及修正一些错误,因此转载请保留原出处,方便溯源,谢谢合作

本文地址:http://www.iamaddy.net/2014/02/javascript%e4%b8%ad%e7%9a%84%e6%ad%a3%e5%88%99%e8%a1%a8%e8%be%be%e5%bc%8f/

想要打赏?你的鼓励是我前进的动力! addy打赏二维码

关注个人公众号web_lab,不定期更新一些干货~ web_lab公众号