JS基础:正则表达式
简介
正则表达式 (regular expression) 描述了一种字符串匹配的模式,可以用来检查一个字符串是否含有某种子串、将匹配的子串做替换或者从某个字符串中取出符合某个条件的子串等。在 JS 中,RegExp 对象和 String 对象的一些方法,如:"search()"、"match()"、"replace()" 等都支持正则表达式。
正则表达式的创建方式
1、实例创建方式:
var reg = new RegExp(pattern, modifiers);
2、字面量创建方式:
var reg = /pattern/modifiers
pattern:正则表达式
modifiers:修饰符
修饰符主要包括:
i:忽略大小写
m:多行匹配,即在到达一行文本末尾时还会继续寻常下一行中是否与正则匹配的项
g:全局匹配,模式应用于所有字符串,而非在找到第一个匹配项时停止
3、实例创建方式和字面量创建方式的区别:
实例创建方式可以进行字符串拼接,而字面量创建方式不可以,例如:
var str = 'test';
var reg1 = new RegExp(str + '123');
var reg2 = /str/;
console.log(reg1); //输出 /test123/
console.log(reg2); //输出 /str/
实例创建方式需要进行字符串转义,而字面量创建方式不需要,例如:
//下面两条语句是等价的
var reg1 = new RegExp('\\d');
var reg2 = /\d/;
这是因为在字符串中 '\' 是转义字符,需要转义 '\',即 '\\'。
语法
1、修饰符
| i | 不区分大小写 |
| m | 多行匹配 |
| g | 全局匹配 |
2、元字符
| . | 匹配除了换行符 '\n' 以外的任意一个字符 |
| \w | 匹配数字、字母和下划线 |
| \W | 匹配数字、字母和下划线之外的任意一个字符 |
| \d | 匹配数字 |
| \D | 匹配非数字 |
| \s | 匹配空白字符 |
| \S | 匹配非空白字符 |
| \b | 匹配单词边界 |
| \B | 匹配非单词边界 |
| \0 | 匹配 'null' 字符 |
| \n | 匹配换行符 |
| \f | 匹配换页符 |
| \r | 匹配回车符 |
| \t | 匹配制表符 |
| \v | 匹配垂直制表符 |
3、量词
| + | 匹配 1 到多个 |
| * | 匹配 0 到多个 |
| ? | 匹配 0 个或 1 个 |
| {n} | 匹配 n 个 |
| {n,} | 匹配 n 到多个 |
| {n,m} | 匹配 n 到 m 个 |
| x$ | 匹配结尾为 x 的字符串 |
| ^x | 匹配开头为 x 的字符串 |
| ?=x | 零宽度正先行断言,仅当子表达式 x 在字符串位置的右侧匹配时才匹配 |
| ?!x | 零宽度负先行断言,仅当子表达式 x 不在字符串位置的右侧匹配时才匹配 |
| ?<=x | 零宽度正后发断言,仅当子表达式 x 在字符串位置的左侧匹配时才匹配 |
| ?<!x | 零宽度负后发断言,仅当子表达式 x 不在字符串位置的左侧匹配时才匹配 |
4、方括号与圆括号
方括号用于给定某个范围的字符集合
| [abcd] | 匹配给定集合中的任何字符 |
| [^abcd] | 匹配给定集合外的任何字符 |
| [0-9] | 匹配从 0 到 9 的数字 |
| [a-z] | 匹配从 a 到 z 的字母 |
圆括号和计算表达式一样,可以提高优先级,也可以用于分组,例如:/a?/ 匹配 0 个或 1 个 'a',/(abc)?/ 则匹配 0 个或 1个 'abc'
5、优先级
\ :转义符
?: 、() 、[] :圆括号和方括号等
+ 、* 、? 、{n} 、{n,} 、{n,m} :量词限定符等
$ 、^ 以及任何元字符和字符
| :或操作
RegExp 对象的 test() 方法
RegExpObject.test(string) :用于检测一个字符串是否匹配某个模式,如果字符串中有匹配的值返回 true ,否则返回 false,例如:
var str = 'Hello World';
var reg = /Hello/;
console.log(reg.test(str)); //输出 true
RegExp 对象的 exec() 方法
RegExpObject.exec(string) :用于检测一个字符串是否匹配某个模式,如果字符串中有匹配的值返回一个结果数组,否则返回 null,例如:
var str = 'Hello World';
var reg = /Hello/;
console.log(reg.exec(str)); //输出 ["Hello", index: 0, input: "Hello World"]
此结果数组的第 0 个元素是与正则表达式匹配的文本,第 1 个元素是与第 1 个分组匹配的文本,第 2 个元素是与第 2 个分组匹配的文本,以此类推。除了数组元素和 length 属性外 exec() 方法还返回两个属性:index 属性保存的是匹配文本的第一个字符的位置,input 属性则存放的是被检索的字符串,例如:
var str = 'Hello World';
var reg = /Hel(lo)/;
console.log(reg.exec(str)); //输出 ["Hello", "lo", index: 0, input: "Hello World"]
如果正则表达式使用了全局匹配修饰符 'g',那么在使用了 exec() 方法后,RegExpObject 对象的 'lastIndex' 属性会设置为匹配文本的最后一个字符的下一个位置,exec() 方法会在 'lastIndex' 指定的位置开始检索字符串,这时你需要手动反复调用 exec() 方法来全局匹配所有符合的文本,直到 exec() 方法再也找不到符合的文本时,它将返回 null,并把 'lastIndex' 属性重置为 0 ,例如:
var str = 'Hello World';
var reg = /Hello/;
console.log(reg.lastIndex); //输出 0
var str = 'Hello World';
var reg = /Hello/g;
console.log(reg.lastIndex); //输出 5
String 对象的 search() 方法
String.search(regExpObject) :用于检索与正则表达式相匹配的子字符串,如果检索到返回匹配子字符串第一个字符的位置,否则返回 -1,例如:
var str = 'Hello World';
var reg = /hello/i;
console.log(str.search(reg)); //输出 0
String 对象的 replace() 方法
String.replace(regExpObject,newvalue) :用于替换与正则表达式相匹配的子字符串,返回替换后的新字符串,例如:
var str = 'Hello World';
var reg = /hello/i;
console.log(str.replace(reg,'newString')); //输出 newString World
String 对象的 match() 方法
String.match(regExpObject) :用于检测一个字符串是否匹配某个模式,如果字符串中有匹配的值返回一个结果数组,否则返回 null,例如:
var str = 'Hello World';
var reg = /Hello/;
console.log(str.match(reg)); //输出 ["Hello", index: 0, input: "Hello World"]
RegExp 对象的 exec() 方法和 String 对象的 match() 方法的区别:
1、当正则表达式没有分组,且非全局匹配时:exec() 方法和 match() 方法执行结果相同,均返回上述结果数组
2、当正则表达式有分组,且非全局匹配时:exec() 方法和 match() 方法执行结果相同,均返回上述结果数组,此结果数组的第 0 个元素是与正则表达式匹配的文本,第 1 个元素是与第 1 个分组匹配的文本,第 2 个元素是与第 2 个分组匹配的文本,以此类推
3、当正则表达式没有分组,且全局匹配时:exec() 方法和 match() 方法执行结果不同,exec() 返回上述结果数组(同非全局匹配),但是设置了 RegExpObject 对象的 'lastIndex' 属性,此时可以根据 'lastIndex' 属性的值反复调用完成全局匹配;match() 方法则直接返回一个数组,包含所有匹配的元素
4、当正则表达式有分组,且全局匹配时:exec() 方法和 match() 方法执行结果不同,exec() 返回上述结果数组(同非全局匹配);match() 方法则忽略分组,只保留全局匹配的元素
也就是说,在非全局匹配时,exec() 方法和 match() 方法是完全相同的,在全局匹配时,match() 方法会忽略分组,只保留全局匹配的元素,exec() 方法则不会忽略分组,而是通过 'lastIndex' 属性进行全局匹配
JS基础:正则表达式的更多相关文章
- DIV+CSS+JS基础+正则表达式
...............HTML系列.................... DIV元素是用来为HTML文档内大块(block-level)的内容提供结构和背景的元素.DIV的起始 ...
- js基础——正则表达式
1.创建方式: var box = new RegExp('box');//第一个参数字符串 var box = new RegExp('box','ig');//第二个参数可选模式修饰符 等同于 v ...
- [JS复习] JS 基础知识
项目结尾,空闲时间,又把<JS 基础知识> 这本书过了一遍,温故知新后,很多知其然不知其所以然的内容 豁然开朗. [1. 用于范围的标签] display :inline or bloc ...
- JS基础--函数与BOM、DOM操作、JS中的事件以及内置对象
前 言 絮叨絮叨 这里是JS基础知识集中讲解的第三篇,也是最后一篇,三篇JS的基础,大多是知识的罗列,并没有涉及更难得东西,干货满满!看完这一篇后,相信许多正在像我一样正处于初级阶段的同学, ...
- js基础--javaScript数据类型你都弄明白了吗?绝对干货
欢迎访问我的个人博客:http://www.xiaolongwu.cn 数据类型的分类 JavaScript的数据类型分为两大类,基本数据类型和复杂数据类型. 基本数据类型:Null.Undefine ...
- 前端面试题目汇总摘录(JS 基础篇)
JS 基础 JavaScript 的 typeof 返回那些数据类型 object number function boolean undefined string typeof null; // o ...
- 前端面试题目汇总摘录(JS 基础篇 —— 2018.11.02更新)
温故而知新,保持空杯心态 JS 基础 JavaScript 的 typeof 返回那些数据类型 object number function boolean undefined string type ...
- js基础 js自执行函数、调用递归函数、圆括号运算符、函数声明的提升 js 布尔值 ASP.NET MVC中设置跨域
js基础 目录 javascript基础 ESMAScript数据类型 DOM JS常用方法 回到顶部 javascript基础 常说的js包括三个部分:dom(文档document).bom(浏览器 ...
- js 基础篇(点击事件轮播图的实现)
轮播图在以后的应用中还是比较常见的,不需要多少行代码就能实现.但是在只掌握了js基础知识的情况下,怎么来用较少的而且逻辑又简单的方法来实现呢?下面来分析下几种不同的做法: 1.利用位移的方法来实现 首 ...
- js 基础
js基础知识点总结 如何在一个网站或者一个页面,去书写你的js代码:1.js的分层(功能):jquery(tool) 组件(ui) 应用(app),mvc(backboneJs)2.js的规划():避 ...
随机推荐
- 12c debug 转 12C 连接CDB和PDB
来源:David Dai -- Focus on Oracle 连接到CDB 12c debug 和普通实例一样的连接. 指定ORACLE_SID 以后可以使用OS认证,也可以使用密码进行连接. [o ...
- sed简单脚本练习
sed脚本的执行顺序可以简记为:Read,Execute,Print,Repeat(读取,执行,打印,重复)简称REPR 分析脚本的执行顺序: l 读取一行到模式空间(sed内部的一个临时缓存,用于存 ...
- 基于Ubuntu14.04下Suricata(一款高性能的网络IDS、IPS和网络安全监控引擎)的搭建(图文详解)(博主推荐)
为什么,要写这篇论文? 是因为,目前科研的我,正值研三,致力于网络安全.大数据.机器学习研究领域! 论文方向的需要,同时不局限于真实物理环境机器实验室的攻防环境.也不局限于真实物理机器环境实验室的大数 ...
- HttpWebRequest 以及WebRequest的使用
1.WebRequest的发送数据以及接收数据 class Program { static void Main(string[] args) { //创建一个实例并发送请求 HttpWebReque ...
- VS2010 好用的javascript扩展工具
工具1) JScript Editor Extensions 折叠代码 下载地址: JScript Editor Extensions 工具2) Javascript parser 以树形方式查的代码 ...
- 【C++】类型转换简述:四种类型转换方式的说明及应用
本文主要简述在C++中四种类型转换的方式:static_cast.reniterpret_cast.const_cast和dynamic_cast. 在介绍C++类型转换方式之前,我们先来看看C语言的 ...
- Harris角点检测原理详解
http://blog.csdn.net/lwzkiller/article/details/54633670 关于角点的应用在图像处理上比较广泛,如图像匹配(FPM特征点匹配).相机标定等.网上也有 ...
- Google浏览器开发者工具:CSSViewer(一个Css查看器)
CSSViewer的简介 CSSViewer是一款可以帮助用户快速查看当前的网页元素的CSS属性的谷歌浏览器插件,在Chrome中安装了CSSViewer插件以后,用户就可以在设计网页的时候,快速地模 ...
- (转)淘淘商城系列——KindEditor富文本编辑器的使用
http://blog.csdn.net/yerenyuan_pku/article/details/72809794 通过上文的学习,我们知道了怎样解决KindEditor富文本编辑器上传图片时的浏 ...
- 【东软实训】SQLselect及其相关操作
SQL select 及相关操作 SQL是用于访问和处理数据库的标准的计算机语言,我们所使用的的是Oracle SQL 一个数据库通常包含一个或多个表,每个表有一个名字表示,下图即为一个名为“emp” ...