《ES6标准入门》阅读笔记——-正则表达式的扩展

写在前面

本系列为在我读完阮一峰老师的《ES6标准入门》第二版之后,所做的阅读笔记的整理。

许多初学ES6, 同时和我一样初次阅读阮老师的这本书的时候, 读第一遍会越发的困惑, 因为阮老师上面说的很多的定义,方法,之前都是没有见过的, 读到后面才发现, 哦~原来是这样.

有一句话叫做”大神的世界我们不懂”, 所以我在初读第一遍《ES6标准入门》这本书的时候,也是踩了不少坑,读书的时候查阅了不少的资料.

所以,在这一系列的笔记教程中,我会从一个初学者的角度,向您讲述ES6的相关知识,在后面介绍的知识我会尽量不提前用,即使提前使用,也会同时做好标注,避免了阅读时各种查阅资料的烦恼.

系列博客将采用一个一个的样例,来说明书中的精华部分(当然,这只是我认为的),同时引导新手,快速入门ES6,并逐步将其投入到生产实践中。

同时,在阅读前也提醒您, 为了系统连贯性的学习ES6的基础知识,建议您从我的博客第一章开始阅读,当然,如果您对对应的知识已经有所了解,那么可以跳转到任意章节阅读,每一篇博客名中均有介绍该博客中涉及到的ES6的内容.

阮一峰老师的这本书是开源的,在其官方博客就可以下载到,但是我强烈建议大家去购买一本书, 一是方便自己查阅ES6中新增的众多API, 二也是表达一下对大神的敬仰.

正则表达式的扩展

在ES6以前,正则表达式的构造函数只能接受字符串作为参数

但在ES6中,是允许RegExp构造函数使用正则表达式作为参数的,这时候会返回一个原有正则表达式的拷贝

如果在使用正则表达式的第二个参数时,则它将会使用第二个修饰符而忽略原有的正则表达式修饰符

1
2
var reg = new RegExp(/abc/ig, 'g').flags // .flags表示查找正则表达式的修饰符,如ige等
console.log(reg) // g

ES6新增了u修饰符,含义为Unicode模式, 用来正确处理大于\uFFFF 的Unicode字符

1
2
console.log(/^\ud83d/u.test('\ud83d\udc2a'))
console.log(/^\ud83d/.test('\ud83d\udc2a')) // 当不使用u操作符的时候,使用utf-16编码的字符无法被正常识别

对于点字符,当字符为utf-16编码是,是无法正常被识别的,此时必须加上u修饰符

1
2
3
4
console.log('\u{20bb7}')
var s = '\u{20bb7}'
console.log(/^.$/.test(s)) // 当正则表达式的标识符不加u时,是不会被识别的,不会被匹配为任意字符,当然,主要原因还是因为它被当成两个字符了
console.log(/^.$/u.test(s)) // true

同时,ES6新增了使用大括号表示Unicode的表示法,这种表示法在正则表达式中必须加上u修饰符才能被识别

1
2
3
4
5
6
7
8
console.log(/\u{61}/.test('a'))
// 当不使用u作为修饰符时,此正则表达式会被认为是u的61个重复
console.log(/\u{61}/u.test('a'))
// 使用u修饰符后,所有量词都会正确识别码点大于0xFFFF的Unicode字符
console.log(/𠮷{2}/u.test('𠮷𠮷'))
// 当我们使用\S(非空格字符)对四字节的字符进行匹配的时候,同样会产生问题:无法正常匹配,原因还是一样,之前ES5将这个字符理解成了两个字符了
console.log(/^\S$/.test('𠮷'))
console.log(/^\S$/u.test('𠮷'))

除了u修饰符,ES6还为正则表达式添加了y修饰符,叫做黏连修饰符(y)

y修饰符的作用与g修饰符类似,也是全局匹配,后一次的匹配都会从上一次匹配成功的下一个位置开始.

1
2
3
4
5
6
7
8
9
10
11
var s = 'sss_ss_s'
var r1 = /s+/g
var r2 = /s+/yg
console.log(s.match(r1))
console.log(s.match(r2))
// 我们使用y修饰符进行匹配,因为同样的s是没有连贯性的出现在一起,所以导致后面的就无法匹配了
var r3 = /s+_/g
var r4 = /s+_/y
console.log(s.match(r3))
console.log(s.match(r4))
console.log(s.match(r4))

ES6为正则表达式提供了flags 和 source 方法,用于返回正则表达式的修饰符 和匹配正文

1
2
3
var r = /s/igy
console.log(r.source)
console.log(r.flags)

(完)

文章目录
  1. 1. 写在前面
  2. 2. 正则表达式的扩展
|