首页 > 代码库 > 正则表达式介绍

正则表达式介绍

1 正则表达式介绍

在JavaScript中,正则表达式是一个用来 匹配 的 并包含 元字符或普通字符 的字符串对象。在JavaScript中,正则表达式是对象。
  • 使用正则表达式的目的:提高效率

1.1 正则表达式的作用

  • 1 匹配
  • 2 提取
  • 3 替换

1.2 识别正则表达式

"123" "abc" "just do IT"

1.3 元字符

  • 在正则表达式中具有特殊意义的专用字符
符号含义
基本元字符 
.匹配除换行符外的任意单个字符
(x)分组
[xyz]字符集合,匹配集合中的任意一个字符,可以用‘-‘指定范围
[^xyz]反义字符集合,匹配任意不在集合中的一个字符
首尾元字符 
^匹配开头位置
$匹配结尾位置
限定元字符 
x*匹配前面的模式 x 出现0次或多次
x+匹配模式 x 出现1次或多次
x?匹配模式 x 出现0次或1次
x{n}n是一个正整数,模式 x 连续出现n次时匹配
x{n,}n是一个正整数,模式 x 连续出现至少n次时匹配
x{n,m}n和m是正整数,模式 x 连续出现至少n次,至多m次时匹配
\转义字符,让普通字符具有特殊用处,让特殊字符不具有特殊用途
简写元字符 
\d匹配任意一个数字0到9,等价于: [0-9]
\D匹配任意一个非数字,等价于:[^0-9]
\w匹配任意一个字母、数字、下划线,等价于:[A-Za-z0-9_]
\W匹配任意一个非字母、数字、下划线的字符,等价于:[^A-Za-z0-9_]
\s匹配一个空白符
\S匹配一个非空白符
  • x|y:匹配 x 或 y。注意:|的优先级最低

  • 贪婪模式: 尽量多的去匹配

? 的其他用处:范围匹配在正则中都是默认的贪婪模式添加 ? 表示取消贪婪模式(跟在次数限定字符后面)取消了贪婪模式之后,就会尽量少的匹配

2 使用正则表达式

2.1 创建正则表达式

  • 语法
// 1 对象形式var r = new RegExp("正则表达式");var r = new RegExp(/正则表达式/);// 2 字面量形式var r = /正则表达式/;
  • 案例:从字符串 "abcdefgh" 中找出 "e" 的位置
// 不使用正则var str = "abcdefgh";for(var i = 0; i < str.length; i++) {    if(str.charAt(i) === "e") {        break;    }}console.log(i);// 使用正则表达式 实现相同功能var str = "abcdefgh";var r = new RegExp("e");var o = r.exec(str);// index 表示匹配到的字符在字符串中的索引号console.log(o.index);

2.2 正则表达式常用方法

2.2.1 exec方法

作用:为指定的一段字符串执行搜索匹配操作,将符合规则的字符串提取出来语法:var m = r.exec(被匹配的字符串);返回值m,是一个数组, 如果没有匹配到,就返回 null索引 0 :表示 正则表达式匹配的字符串input: 表示被匹配的整个字符串
  • 练习:从字符串 "abcdefgh" 中找出 "ef" 的位置
var str = "abcdefghij";var r = new RegExp("ef");var o = r.exec(str);console.log(o.index);

2.2.2 全局模式

  • 循环查找案例:
从字符串 "abcdefghabcdefghabcdefgh" 中找出所有 "e" 的位置
var str = "abcdefghabcdefghabcdefgh";var retArr = [];var index = -1;do {    index = str.indexOf("e", index + 1);    if(index !== -1) {        retArr.push(index);    }} while(index !== -1);
  • 全局模式标记:g (global)
作用:只在循环多次匹配中起作用补充 exec 的说明在 exec 的方法中有一个规定:同一个 正则表达式对象 如果开启了全局模式,每调用一次 exec 方法就会继续查找下一个字符, 直到最后找不到 返回 null
var str = "abcdefghabcdefghabcdefgh";// 使用全局匹配模式var r = new RegExp("e", "g"); // r = /e/g;var arr = [], m;while((m = r.exec(str)) !== null) {    arr.push(m.index);}console.log(arr);
  • 练习:从字符串 "abcabcabc" 中找出所有 "bc" 的位置

2.3 正则表达式-分组

  • 案例:解析邮箱字符串:"tom@126.com, jerry@163.com, dog@qq.com"
利用 exec 方法提取到的结果是一个数组类型的对象,里面包含一些有用的信息。在正则表达式中使用 圆括号 来分组, 分组后匹配到的结果可以直接获取对应的部分
var r = /([a-zA-Z0-9]+)@([a-zA-Z0-9\.]+)/g;var m, arr = [], str = "tom@126.com, jerry@163.com, dog@qq.com";while((m = r.exec(str)) !== null) {    arr.push({user: m[1], host: m[2]});}console.log(arr);

2.3.1 分组技巧

1 从左往右数 (2 从 1 开始给 ( 编号那么匹配的结果对应的 下标 就是该圆括号分的的内容
  • 练习: "(a(b(c)))" 有哪几组?
var str = "abc";var r = /(a(b(c)))/;var m = r.exec(str);console.log(m);
  • 注意点:分组可以捕获也可以不被捕获
如果希望分组不捕获,在分组的圆括号里面的开始加上 ?:,即:(?:)比如:/(?:2b)+/ 希望 "2b" 重复出现

2.4 转义字符

在 正则中有很多的元字符, 如果要匹配元字符,需要使用转义字符使用 构造函数 创建正则表达式的语法,要注意:var r = new RegExp("\\."); // 两个反斜线表示一个反斜线var r = /\./;

2.5 正则表达式-替换

2.5.1 字符串的 replce 方法-替换

  • 语法
新字符串 = 字符串.replace(匹配字符串, 替换字符串);新字符串 = 字符串.replace(正则表达式, 替换字符串);
  • 示例(基本用法)
var str = "123";var newStr = str.replace("1", "a");console.log(newStr); // 
  • 示例(正则用法)
var str = "123";var newStr = str.replace(/\d/, "a");console.log(newStr); // // 开启全局模式var newStr = str.replace(/\d/g, "a");alert(newStr); // 
  • 案例:去掉空格 " #div, .cls div , span " 为:"#div,.cls div,span"
var str = "   #div,    .cls div ,   span  ";var newStr = str    .replace(/^\s+|\s+$/g, "")    .replace(/\s+/g, " ")    .replace(/,\s/g, ",")    .replace(/\s,/g, ",");console.log("|" + newStr + "|");

2.5.2 字符串的 replce 方法-组引用

  • 案例:将日期 "1995-1-1" 修改为:"1995年1月1号"
var str = "1995-1-1";var newStr = str.replace(/(\d+)\-(\d+)\-(\d+)/, "$1年$2月$3日");console.log(newStr);

正则表达式介绍