ES6知识点总结（六）

ES6知识点总结（六）

正则表达式及应用

正则表达式(regular expression)描述了一种字符串匹配的模式（pattern）

• 可以用来检查一个串是否含有某种子串、将匹配的子串替换或者从某个串中取出符合某个条件的子串等。
• 由普通字符（例如字符 a 到 z）以及特殊字符（称为"元字符"）组成的文字模式。

修饰符

• g：global，全文搜索，若不添加，则搜索到第一个匹配即停止
• i：ignore case，忽略大小写，正则表达式是大小写敏感的。
• m：multiple lines，多行搜索，搜索时识别换行符

元字符

有特殊意义的非字母字符，一个字符对应字符串的一个字符

• [ ]，构造一个简单的类
  例如： a、b、c 归位一类 ，即[abc]
• ^，取反，即匹配不属于该类的字符
  例如：[^abc]表示不是字符 a、b、c 其中之一的字符
• [a-z]表示从 a 到 z 之间的任意字符，且包含 a 和 z 本身

let str = "a1b2c3d4z0";
console.log(str.replace(/[a-z]/g, "X"));       //X1X2X3X4X0

• .(点)，[^\r\n]，除了回车符和换行符之外的所有字符。
• \d，[0-9]，数字字符
• \D，[^0-9]，非数字字符
• \s，[\t\n\x0B\f\r]，空白符，\f 换页符，\r 回车符，\t 水平制表符，\n 换行符，\x0b 垂直制表符
• \S，[^\t\n\x0b\f\r]，非空白符
• \w，[a-zA-Z_0-9]，单词字符（包括字母、数字和下划线）
• \W，[^a-za-z_0-9]，非单词字符（除字母、数字和下划线之外的字符

匹配边界

• ^，以 xxx 开始
• $，以 xxx 结束

let str = "@123@abc@";
console.log(str.replace(/^@./g, "Q"));      //Q23@abc@
console.log(str.replace(/.@/g, "Q"));        //@12QabQ
console.log(str.replace(/.@$/g, "Q"));      //@123@abQ

• \b，单词边界
• \B，非单词边界

let str = "This is a boy";
console.log(str.replace(/\bis\b/g, "0"));      //This 0 a boy
console.log(str.replace(/\Bis\b/g, "0"));     //Th0 is a boy

• ?，出现 0 次或 1 次
• +，出现 1 次或多次
• *，出现 0 次或多次
• {n}，出现 n 次
• {n, m}，出现 n 到 m 次
• {n,}，出现 n 次或更多次
• | 表示或，表示|左右字符二选一
• $n的形式引用模式中分组匹配到的文本，n为索引，从1开始

console.log("2020-03-04" .replace(/(\d{4})-(\d{2})-(\d{2})/g, "$2/$3/$1"));
//03/04/2020

• () ,分组
• ?：,不捕获分组

console.log("a1b2c3d4".replace(/[a-z]\d{3}/g, "X"));        //a1b2c3d4
console.log("a1b2c3d4".replace(/([a-z]\d){3}/g, "X"));      //Xd4

console.log("2020-03-04" .replace(/(\d{4})-(\d{2})-(?:\d{2})/g, "$2/$3/$1"));
//03/$3/2020

贪婪模式
正则表达式会尽可能多的匹配

console.log("12345678".replace(/\d{3,6}/g, "x"));      //x78

非贪婪模式
即尽可能少的匹配，一旦成功匹配就不再继续尝试其他的可能性。
在模式后面加上？

console.log("12345678".replace(/\d{3,6}?/g, "x"));      //xx78

前瞻
在正则表达式匹配到规则的时候，向前检查是否符合断言。符合和不符合特定断言称为“肯定/正向”和“否定/负向”匹配

• 正向前瞻，exp(?=assert)
• 负向前瞻，exp(?!assert)

console.log("a2*34V8".replace(/\w(?=\d)/g, "X"));      //X2*X4X8
console.log("a2*34V8".replace(/\w(?!\d)/g, "X"));      //aX*3XVX

创建正则表达式对象

JavaScript中使用RegExp对象来封装一个正则表达式，并提供相关的方法和属性。
两种创建方法

1. 字面量

let reg = /\bis\b/g; //g表示全文匹配
let str = "He is a boy. This is a dog. Where is she?";
console.log(str.replace(reg, "IS"));       //He IS a boy. This IS a dog. Where IS she?

2. 构造函数

let reg = new RegExp("\\bis\\b", "g");
let str = "He is a boy. This is a dog. Where is she?";
console.log(str.replace(reg, "IS"));     //He IS a boy. This IS a dog. Where IS she?

RegExp对象属性

• global，是否全文搜索，默认 false。
• ignoreCase，是否忽略大小写，默认 false。
• multiline，是否多行搜索，默认 false。
• lastIndex，当前表达式匹配内容的最后一个字符的下一个位置。
• source，正则表达式的文本字符串。

let reg2 = /\w/gim;
console.log(reg2.global);           //true
console.log(reg2.ignoreCase);    //true
console.log(reg2.multiline);        //true
//以上三个属性都是只读的。
console.log(reg2.source);         //\w

RegExp对象方法

• test(str)，用于测试字符串参数中是否存在匹配正则表达式模式的字符串，返回 true 或 false
• exec(str) 方法用于检索字符串中的正则表达式的匹配
  返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null。
  index，声明匹配文本的第一个字符的位置
  input，存放被检索的字符串 string

let reg1 = /\w{1,2}/g;
  console.log(reg1.test("ab,cd"));    //true
  console.log(reg1.exec("ab,cd")); //["cd", index: 3, input: "ab,cd", groups: undefined]

字符串正则方法

• search(reg)，用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串。返回第一个匹配结果的 index，没有匹配到返回-1。不执行全局匹配。
• match(reg)，检索字符串以找到一个或多个与 regexp 匹配的文本，未找到返回 null，找到后返回一个数组。与 RegExp 的 exec()方法相同。
• split(reg)，利用 regexp 匹配结果作为分隔符对字符串进行分割，返回一个数组。
• replace(reg, newStr)，将 regexp 的匹配结果替换成 newStr，返回一个新字符串。

let str = "<java> and <javascript> is deferent!";
  console.log(str.match(/<\S*>/g));          //["<java>", "<javascript>"]
 
  console.log(str.replace(/<(\S*)>/g, "<<$1>>"));  
  //<<java>> and <<javascript>> is deferent!
 
  console.log(str.split(/[<>]/g));   //["", "java", " and ", "javascript", " is deferent!"]

• replace(reg, function)的用法

let s1 = "a1b23d4e5".replace(/\d/g, function(match, index, origin) {
  console.log(index);
  return parseInt(match) + 1;
});
//1
//3
//4
//6
//8