JS正则表达式

发表于   |   分类于   |     |  

[TOC]

正则符号

1.字母与数字

  • .：查找单个字符，除了换行和行结束符
  • [a-z0-9]：方括号中任意字符
  • [0-9]：数字
  • \w： 查找单词字符
  • \d：数字

2.空白符

  • \b：匹配单词边界 var str="Visit Runooob"; var patt1=/\bRun/g;
  • \s：空白字符，包括空格、回车、换行、换页…
  • \n：换行
  • \r：回车

3.定位符

  • ^：行首匹配，以什么开始的 ^(abc)
  • $：行尾匹配，以什么结束的 ( def)$

4.限定符

  • x?：匹配0个或1个
  • x*：匹配>=0个
  • x+：匹配>0个
  • x{m,n}：匹配m到n范围个

5.分组

  • (?:x)：匹配x但是不记录匹配结果
  • x(?=y)：x后紧跟着y时匹配x
  • x(?!y)：当x后不是y时匹配x

正则常用方法

字符串中方法

  1. match:
    str.match(reg)
  • 功能：match() 方法将检索字符串 str，以找到一个或多个与 reg匹配的文本
  • 参数：reg正则表达式，如果表达式内没有g则只指向一次匹配
  • 返回：如果没有找到任何匹配的文本， match() 将返回 null。否则，它将返回一个数组，其中存放了与它找到的匹配文本有关的信息
    如果reg内不包含g则数组第 0 个元素包含匹配到的文本其余元素放的是分组匹配到的，数组还包含两个对象，index 表示匹配文本在字符串中的位置，input 表示被解析的原始字符串；如果有 g 标识，则返回一个数组，包含每一次的匹配结果
    1
    2
    3
    4
    5
    6
    7
    8
    var str = 'hello world';            //首先创建好字符串
    var pattern = /([a-z]+)\s([a-z]+)/; //先通过正则匹配这个字符串，用分组模式来获取这两个单词
    var arr = str.match(pattern); // exec方法返回的是一个数组，包含匹配到的字符串以及分组(也称子串)里的值
    console.log(arr); //['hello world','hello','world']  
    console.log(arr[0]); //'hello world' 匹配到的字符串
    console.log(arr[1]); //'hello' 第一个分组([a-z]+)的值
    console.log(arr[2]); //'world' 第二个分组([a-z]+)的值

2.replace 该方法不会改变原始字符串
str.replace(要搜索的字段str/regexp,替换的新字段replacement)
str.replace(reg,function(a){return })
replace 方法第二个参数替换的新字段replacement里面可以用 $1 - $9 来指代相应的分组

  • 功能：找到要搜索的字串并逐一做处理替换，把匹配到的东西用return的东西替换
  • 参数：要搜索的字段str/regexp,可以是字串和正则表达式。替换的新字段replacement，可以是字串和函数。
  • 返回：一个新的字符串，是用 replacement 替换了 regexp 的第一次匹配或所有匹配之后得到的。

3.search
search 接受一个正则作为参数，如果参入的参数不是正则会隐式的使用 new RegExp(obj)将其转换成一个正则，返回匹配到子串的起始位置，匹配不到返回-1

4.split
接受两个参数，返回一个数组。第一个是用来分割字符串的字符或者正则，如果是空字符串则会将元字符串中的每个字符以数组形式返回，第二个参数可选作为限制分割多少个字符，也是返回的数组的长度限制。有一个地方需要注意，用捕获括号的时候会将匹配结果也包含在返回的数组中

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var myString = "Hello 1 word. Sentence number 2.";
 var splits = myString.split(/\d/);
 console.log(splits);
 // [ "Hello ", " word. Sentence number ", "." ]
 splits = myString.split(/(\d)/);
 console.log(splits);
 // [ "Hello ", "1", " word. Sentence number ", "2", "." ]
作者：网易考拉前端团队
链接：https://juejin.im/post/59b5e50f51882519777c4815
来源：掘金
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

正则对象reg的方法

  1. test
    接受一个字符串参数，如果正则表达式与指定的字符串匹配返回 true 否则返回 false

    1
    2
    3
    var str = "2017.06.27";
    var reg = /\b(\d+)\b/g;
    reg.test(str)

  2. exec
    同样接受一个字符串为参数，返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null
    匹配时，返回值跟 match 方法没有 g 标识时是一样的。数组第 0 个表示与正则相匹配的文本，后面 n 个是对应的 n 个捕获的文本，最后两个是对象 index 和 input
    只是有 g 标识的时候可以反复调用 exec() 方法来遍历字符串中的所有匹配文本

小记

javascript正则表达式里分组模式以小括号来()表示分组，例：/([a-z])/
捕获性分组：()
捕获性分组工作模式()会把每个分组里匹配的值保存起来。
比如利用捕获性分组把 hello world 互换成 world hello：
方法一：通过exec函数

1
2
3
4
5
6
7
8
9
10
11
12
var str = 'hello world';            //首先创建好字符串
var pattern = /([a-z]+)\s([a-z]+)/; //先通过正则匹配这个字符串，用分组模式来获取这两个单词
var arr = pattern.exec(str); // exec方法返回的是一个数组，包含匹配到的字符串以及分组(也称子串)里的值
console.log(arr); //['hello world','hello','world']  
console.log(arr[0]); //'hello world' 匹配到的字符串
console.log(arr[1]); //'hello' 第一个分组([a-z]+)的值
console.log(arr[2]); //'world' 第二个分组([a-z]+)的值
//这时候两个分组的值都得到了,接下来用字符串拼接法实现互换
var n_str = arr[2]+' '+arr[1];
console.log(n_str) //world hello

方法二：通过属性$1-9

1
2
3
4
5
6
7
8
9
var str = 'hello world';            
var pattern = /([a-z]+)\s([a-z]+)/; 
pattern.test(str); //这个地方必须运行正则匹配一次，方式不限，可以是test()、exec()、以及String的正则方式
console.log(RegExp.$1) //'hello' 第一个分组([a-z]+)的值
console.log(RegExp.$2) //'world' 第二个分组([a-z]+)的值
var n_str = RegExp.$2+' '+RegExp.$1;
console.log(n_str) //world hello

方法三：通过String的replace()

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
var regex = /(\d{4})-(\d{2})-(\d{2})/;
var string = "2017-08-09";
var result = string.replace(regex, "$2/$3/$1");
console.log(result); // "08/09/2017"
等价
var result = string.replace(regex, function() {
    return RegExp.$2 + "/" + RegExp.$3 + "/" + RegExp.$1;
});
console.log(result); // "08/09/2017"
等价
var regex = /(\d{4})-(\d{2})-(\d{2})/;
var string = "2017-08-09";
var result = string.replace(regex, function(match, year, month, day) {
    return month + "/" + day + "/" + year;
});
console.log(result); // "08/09/2017"
作者：网易考拉前端团队
链接：https://juejin.im/post/59b5e50f51882519777c4815
来源：掘金
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

热评文章