首页 代码干货

前言

在开发业务逻辑中有很多非常规的判断验证,若只用if去判断就太low了

使用方法

JavaScript使用正则的两种方式:
1.构造函数:使用内置函数RegExp构造函数

var regConst = new RegExp('abc');

2.字面量:使用双斜杠//

var regeLiteral = /abc/;

匹配方法

同样的,有两个可用方法:testexec
1.test()方法接受一个参数,这个参数是用来与正则表达式匹配的字符串:

var regex = /hello/;
var str = 'hello world';
var result = regex.test(str);
console.log(result);
// returns true

2.exec()方法在一个指定字符串中执行一个搜索匹配,返回一个结果数组或null

var regex = /hello/;
var str = 'hello world';
var result = regex.exec(str);
console.log(result);
// returns [ 'hello', index: 0, input: 'hello world', groups: undefined ]
// 匹配失败会返回null
// 'hello' 待匹配的字符串
// index: 正则表达式开始匹配的位置
// input: 原始字符串

PS:我个人比较习惯使用test()来进行匹配

匹配符号

符号是用来表示搜索字符串范围的一个参数,共6个符号:

符号描述
g全局搜索。
i不区分大小写搜索。
m多行搜索。
s允许.匹配换行符。
u使用unicode码的模式进行匹配。
y执行“粘性”搜索,匹配从目标字符串的当前位置开始,可以使用y符号。

双斜杠语法:

var re = /pattern/flags;

构造函数语法:

var re = new RegExp("pattern","flags");

真枪实战:

var reg1 =/ac/gi;
var reg2 = new RegExp("abc","gi");
var str ='ABC';
console.log(reg1.test(str)); // true
console.log(reg2.test(str)); // true

正则表达式的理解

正则表达式是只对字符串进行匹配的一种模式。
最简单的匹配方式就是完整匹配:

var regex = /hello/;
console.log(regex.test("hello world"));
//true

比较复制的匹配方式:
正则表达式中有很多特殊字符用来匹配字符串,解决的就是匹配多少(按位置匹配),和匹配谁(按内容匹配)的问题。

普通的特殊字符

  • [xyz]:字符集,用来匹配方括号中的任意一个字符:
    var regex = /[bt]ear/;
    console.log(regex.test('tear'));  //return true
    console.log(regex.test('bear'));  //return true
    console.log(regex.test('fear'));  //return false

PS:除了特殊字符^外,其他所有特殊字符在字符集(方括号中)都会失去它的特殊含义。

  • [^xyz]:这也是个字符集,和上面字符集的作用恰恰相反,匹配所有不在方括号中的字符:

    var regex = `/[^bt]ear/`;
    console.log(regex.test('tear')); //return false
    console.log(regex.test('bear')); //return false
    console.log(regex.test('fear')); //return true

针对大小写字母和数字这三种非常常用的字符,还提供了比较简便的写法:

  • \d:相当于 [0-9],匹配数字字符。
  • \D:相当于 [^0-9],匹配非数字的字符。
  • \w:相当于 [a-zA-Z0-9_],匹配数字,大小写字母和下划线。
  • \W:相当于 [^A-Za-z0-9_],匹配非数字,非大小写字母和下划线。
  • [a-z]:如果想匹配所有字母,最简单粗暴的方法就是把所有字母都填到方括号中(例如:[abcdefghi......])很明显,这方法不实用,而且还容易漏掉某个字母,所以 用 最最最简单的方法(范围取值)[a-z] 这里指的是 从a开始到z结束的所有字母,这种方法最简单最实在:

    var regex = /[a-z0-9A-Z]ear/;
    console.log(regex.test('fear')); //return true
    console.log(regex.test('tear')); //return true
    console.log(regex.test('1ear')); //return true
    console.log(regex.test('Tear')); //return true
  • x|y:匹配x或y:

    var regex = /(green|red)apple/;
    console.log(regex.test('green apple')); //return true
    console.log(regex.test('red   apple')); //return true
    console.log(regex.test('blue  apple')); //return false
  • .:匹配除换行符之外的任何单个字符,如果标志中有s则也会匹配换行符:
    var regex =/.n/;
    console.log(regex.test('an'));   //return true
    console.log(regex.test('no'));   //return false
    console.log(regex.test('on'));   //return true
    console.log(regex.test('  n'));  //return true
    console.log(/.ns/.test('  n'));  //return false
  • \:这个特殊字符是用来转义的,比我我们想匹配方括号,就可以用\转义,同样相匹配也可以用\转义:
    var regex = /\[\]/;
    console.log(regex.test('[]')); //return true

PS:默认情况下特殊字符都只能匹配某个目标字符串一次。

  • {n}:匹配大括号之前的字符n次:
    var regex = /go{2}d/;
    console.log(regex.test('good')); //return true
    console.log(regex.test('god')); //return false

这里很好理解,/go{2}d/相当于/good/

-{n,}:匹配大括号之前的字符至少n次:

 var regex = /go{1,2}d/;
    console.log(regex.test('god'));  //return true
    console.log(regex.test('good')); //return true
    console.log(regex.test('goood'));//return false

这里也很好理解{1,2}就是要求o出现1或2次

正则提供了三个比较常用规则更为方便的写法:

  • *:相当于{0,}。表示前一位的字符至少出现0次,也就是出现任意次。
  • +:相当于{1,}。表示前一位的字符至少出现1次及以上。
  • ?:相当于{0,1}。表示前一位的字符不出现或是出现1次.(用于判断是否存在)

使用以上内容匹配普通的业务需求基本已经满足。但像换行符、换页符、回车等特殊的符号上面所讲的特殊字符就无法满足需要了,因此正则表达式提供了专门用来匹配特殊符号的特殊字符:

  • \s :匹配一个空白字符,包括空格、制表符、换页符、换行符。
  • \S :匹配一个非空白字符。
  • \t :匹配一个水平制表符。
  • \n :匹配一个换行符。
  • \f :匹配一个换页符。
  • \r :匹配一个回车符。
  • \v :匹配一个垂直制表符。
  • \0 :匹配NULL(U+0000)字符。
  • [\b]:匹配一个退格。
  • \cX :当X是出于A到Z之间的字符的时候,匹配字符串中的一个控制符。

内容匹配进阶

  • (x):匹配x并记住x,括号内的内容被称为捕获组。这个括号里强大的是可以支持子表达式,就是说可以在括号内去写正则,然后作为一个整体去匹配。这里还有一个特殊字符叫\n,这个n和前面的换行符不一样,这里指的是数字,用来记录捕获组序号的:

       console.log(/(foo)(bar)\1\2/.test('foobarfoobar'));// return true
       console.log(/(\d)([a-z])\1\2/.test('1a1a')); //return true
       console.log(/(\d)(a-z)\1\2/.test('1a2a')); //return false
       console.log(/(\d){2}/.test('12'));  //return true
    

JS中可以使用正则表达式的方法

方法描述
RegExp.prototype.exec一个在字符串中执行查找匹配的RegExp方法,它返回一个数组(未匹配到则返回 null)
RegExp.prototype.test一个在字符串中测试是否匹配的RegExp方法,它返回 true 或 false
String.prototype.match一个在字符串中执行查找匹配的String方法,它返回一个数组,在未匹配到时会返回 null
String.prototype.matchAll一个在字符串中执行查找所有匹配的String方法,它返回一个迭代器(iterator)
String.prototype.search一个在字符串中测试匹配的String方法,它返回匹配到的位置索引,或者在失败时返回-1
String.prototype.replace一个在字符串中执行查找匹配的String方法,并且使用替换字符串替换掉匹配到的子字符串
String.prototype.split一个使用正则表达式或者一个固定字符串分隔一个字符串,并将分隔后的子字符串存储到数组中的 String 方法

总结

正则表达式各种规则很难记的,但也要记住这些基础的特殊字符,日后在逻辑处理上能派上大用场的!


文章评论

目录