Javascript正则表达式

今年的第一篇javascript文章就是这个正则表达式了,之前的文章是转载别人的,不算自己的东西,可以忽略不计,最近突然想把转载别人的东西统统删掉,因为转载过的文章,我根本没有从中获得收获,纯粹是浪费时间,虽然说可以留着以后需要的时候来查看,可是这是一个非常不好的念头。今年我将不会再转载别人的一篇文章了,如果觉得有用,我会把它收藏到云笔记上,推荐使用印象笔记,比网易的云笔记好了N倍,谁用谁知道。

如果看到好的博客,我将会把它订阅到feedly里面,有空的时候就会翻出来看看他们写过的新技术和研究,看国外的博客需要用心和花费一点时间才能有收获。看博客的时候最关键还是需要动手操作,自己写一遍代码,胜过你读几遍文章。

正则表达式花费了很多时间,主要是我看视频总是不自觉的眼困,以后就专门用7:30分到9:30分来学习javascript了,无论是看书还是看视频,打算买一本精通Javascript书,电子版看着挺不错的。

什么是正则表达式

正则表达式(regular expression)是一个描述字符模式的对象。使用正则表达式可以进行强大的模式匹配和文本检索与替换功能。

创建正则表达式

创建正则表达式和创建字符串相似,创建正则表达式提供了两种方法,一种采用new运算符,另一种采用字面量方式。

1.var box = new RegExp(‘box’); 第一个参数字符串

var box = new RegExp(‘box’,’ig’); 第二个参数可选模式修饰符

参数 含义
i 忽略大小写
g 全局匹配
m 多行匹配

2,var box = /Box/; 使用字面量方式的正则

var box = /Box/ig; 第二个斜杠后加模式修饰符

测试正则表达式

RegExp对象包含两个常用方法:test()和exec(),功能基本相似,用于测试字符串匹配。

test()方法在字符串中查找是否存在指定的正则表达式,并返回布尔值,如果存在则返回true,否则返回false。

exec()方法也用于在字符串中查找指定正则表达式,如果exec()执行成功,则返回包含该查找字符串的相关信息数据,否则返回null。(返回结果数组)

var pattern = new RegExp('Box','i');
var str = 'box';
alert(pattern.test(str)); //true
var pattern = /Box/i;
var str = 'box';
alert(pattern.test(str)); //true
var pattern = /Box/i;
var str = 'This is a box';
alert(pattern.test(str)); //true
var pattern = /Box/i;
var str = 'box';
alert(pattern.exec(str)); box
返回的是数组,有就返回数组的值,没有匹配到就返回null
var str ='ss';
alert(pattern.exec(str)); 没有匹配到返回null

使用字符串的正则表达式方法

string对象也提供了4个使用正则表达式的方法

方法 含义
match(pattern) 在一个字符串中寻找一个与正则表达式模式(pattern)的匹配/返回pattern中的字串或者null
replace(pattern,replacement) 用replacement替换pattern
search(pattern) 返回与正则表达式(pattern)的匹配
split(pattern) 返回字符串按指定pattern拆分的数组
var pattern = /Box/ig; //开启全局
var str = 'This is a Box';
alert(str.match(pattern)); //匹配所有
var pattern = /box/ig;
var str = 'This is a box! That is a Box too!';
alert(str.replace(pattern,'supperman'));
//This is a supperman! That is a supperman too';
var pattern= /!/ig;
alert(str.split(pattern)); //This is a supperman!, That is a supperman too !,

RegExp对象的属性

属性 意义
$1(到$9) 圆括号包围的字符串匹配
$_ 相当于input
$* 相当于multiline
$& 相当于lastMatch
$+ 相当于lastParen
$` 相当于leftContext
$’ 相当于rightContext
constructor 指定创建对象原型的函数
global 全局搜索(使用g修饰符)
ignoreCase 不区分大小写搜索(使用i修饰符)
input

如果没有传递字符串,这就是要搜索的字符串

lastIndex 继续匹配的起始位置
lastMatch 最后一个匹配的字符串
lastParen 最后的圆括号包围的子字符串匹配
leftContext 最近一个匹配字符串左边的子字符串
multiline 是否跨多行搜索字符串
prototype 允许在所有对象中添加属性
rightContext 最近一个匹配字符串右边的子字符串
source 正则表达式模式本身

JavaScript元字符

正则表达式元字符是包含特殊含义的字符,他们有一些功能,可以控制匹配模式的方式,反斜杠后的元字符将失去其特殊含义。

元字符/元符号 匹配
\

在字面意义和特殊意义之间进行切换。例如w表示w的特殊意义而不是字面值w,但是$表示不使用$的特殊意义而是使用$字符本身

^ 字符串的开头
$ 字符串的结尾
* 零次或者多次
+ 一次或者多次
? 零次或者一次
. 除换行符外的任何字符
\b 单词边界
\B 非单词边界
\d 0-9的任何数字(与[0-9]相同)
D 任何非数字
\f 换页符
\n 换行符
\r 回车符
\s 任何一个空白字符(与[fnrtv]相同)
\S 任何一个非空白字符
\t 制表符
\v 垂直制表符
\w 任何字母、数字以及下划线(与[a-zA-Z0-9_]相同)
\W 除数字、字母及下划线外的其他字符

\xnn

十六进制数字nn定义的ASCII字符
\onn 八进制数字nn定义的ASCII字符
\cX 控制字符X
[abcde] 与其中任何字符匹配的字符串
[^abcde] 字符补集,与其中任何字符都不匹配的字符集
[a-e] 与其中的字符范围匹配的字符集
[\b] 退格字符的字面量意义(不同于b)
{n} 前面的字符正好出现n次
{n,} 前面的字符至少出现n次
{m,n} 前面的字符至少出现m次,最多n次
() 一个组,可以在后面引用它
x|y x或y

o+ 表示1个或者多个o

x? 表示0个或者1个x

x* 表示0个或者多个x

(xyz)+匹配至少一个(xyz)

x{m,n} 匹配至少m个,最多n个x

 


关注我

我的微信公众号:前端开发博客,在后台回复以下关键字可以获取资源。

  • 回复「小抄」,领取Vue、JavaScript 和 WebComponent 小抄 PDF
  • 回复「Vue脑图」获取 Vue 相关脑图
  • 回复「思维图」获取 JavaScript 相关思维图
  • 回复「简历」获取简历制作建议
  • 回复「简历模板」获取精选的简历模板
  • 回复「加群」进入500人前端精英群
  • 回复「电子书」下载我整理的大量前端资源,含面试、Vue实战项目、CSS和JavaScript电子书等。
  • 回复「知识点」下载高清JavaScript知识点图谱

每日分享有用的前端开发知识,加我微信:caibaojian89 交流