简介

  正则表达式 (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基础:正则表达式的更多相关文章

  1. DIV+CSS+JS基础+正则表达式

    ...............HTML系列....................        DIV元素是用来为HTML文档内大块(block-level)的内容提供结构和背景的元素.DIV的起始 ...

  2. js基础——正则表达式

    1.创建方式: var box = new RegExp('box');//第一个参数字符串 var box = new RegExp('box','ig');//第二个参数可选模式修饰符 等同于 v ...

  3. [JS复习] JS 基础知识

    项目结尾,空闲时间,又把<JS 基础知识> 这本书过了一遍,温故知新后,很多知其然不知其所以然的内容 豁然开朗. [1. 用于范围的标签] display  :inline or bloc ...

  4. JS基础--函数与BOM、DOM操作、JS中的事件以及内置对象

       前   言 絮叨絮叨 这里是JS基础知识集中讲解的第三篇,也是最后一篇,三篇JS的基础,大多是知识的罗列,并没有涉及更难得东西,干货满满!看完这一篇后,相信许多正在像我一样正处于初级阶段的同学, ...

  5. js基础--javaScript数据类型你都弄明白了吗?绝对干货

    欢迎访问我的个人博客:http://www.xiaolongwu.cn 数据类型的分类 JavaScript的数据类型分为两大类,基本数据类型和复杂数据类型. 基本数据类型:Null.Undefine ...

  6. 前端面试题目汇总摘录(JS 基础篇)

    JS 基础 JavaScript 的 typeof 返回那些数据类型 object number function boolean undefined string typeof null; // o ...

  7. 前端面试题目汇总摘录(JS 基础篇 —— 2018.11.02更新)

    温故而知新,保持空杯心态 JS 基础 JavaScript 的 typeof 返回那些数据类型 object number function boolean undefined string type ...

  8. js基础 js自执行函数、调用递归函数、圆括号运算符、函数声明的提升 js 布尔值 ASP.NET MVC中设置跨域

    js基础 目录 javascript基础 ESMAScript数据类型 DOM JS常用方法 回到顶部 javascript基础 常说的js包括三个部分:dom(文档document).bom(浏览器 ...

  9. js 基础篇(点击事件轮播图的实现)

    轮播图在以后的应用中还是比较常见的,不需要多少行代码就能实现.但是在只掌握了js基础知识的情况下,怎么来用较少的而且逻辑又简单的方法来实现呢?下面来分析下几种不同的做法: 1.利用位移的方法来实现 首 ...

  10. js 基础

    js基础知识点总结 如何在一个网站或者一个页面,去书写你的js代码:1.js的分层(功能):jquery(tool) 组件(ui) 应用(app),mvc(backboneJs)2.js的规划():避 ...

随机推荐

  1. 员工管理系统(集合与IO流的结合使用 beta4.0 ObjectInputStream/ ObjectOutputStream)

    package cn.employee_io; import java.io.Serializable; public class Employee implements Serializable{ ...

  2. rhel7安装oracle 11gR2,所需的依赖包

    binutils-2.23.52.0.1-30.el7.x86_64 compat-libstdc++-33-3.2.3-61.x86_64compat-libstdc++-33-3.2.3-61.i ...

  3. NSoup获取网页源代码

    NSoup是JSoup的Net移植版本.使用方法基本一致. 如果项目涉及HTML的处理,强烈推荐NSoup,毕竟字符串截断太苦逼了. 下载地址:http://nsoup.codeplex.com/ # ...

  4. Java核心技术梳理-异常处理

    一.引言 异常总是不可避免的,就算我们自身的代码足够优秀,但却不能保证用户都按照我们想法进行输入,就算用户按照我们的想法进行输入,我们也不能保证操作系统稳定,另外还有网络环境等,不可控因素太多,异常也 ...

  5. 前端:常见的6种HTML5错误用法

    一.不要使用section作为div的替代品 人们在标签使用中最常见到的错误之一就是随意将HTML5的<section>等价于<div>——具体地说,就是直接用作替代品(用于样 ...

  6. 了解移动用户的隐私期望:一种基于推荐的Crowdsourcing方法

    应学习之需,最近一段时间阅读了一篇论文,特写下总结,若有纰漏,还望指出. 目录 引言 推荐机制 实现 评估 心得 1.1 为什么要了解移动用户的隐私期望 1.移动设备的广泛使用存在一些潜在的隐私威胁和 ...

  7. 掌握Spark机器学习库-07-随机梯度下降

    1)何为随机梯度下降 优化方法 迭代更新,来寻找函数全局最优解的方法 与最小二乘法相比:适用于变量众多,模型更复杂 2)梯度 变化最快,“陡峭” 通过函数表达式来衡量梯度 3)随机梯度下降原理推导过程 ...

  8. js阻塞ui进程涉及的知识点整理

    项目进行中遇到了同步ajax阻塞ui线程阻塞的问题,原因是执行两个同步ajax请求为一次完整的方法,因业务需求需要循环执行这个方法,检查后台返回的数据正确,但是由于ajax请求时间过长,考虑增加遮罩层 ...

  9. asp IIS网站的配置(Win7下启用IIS7配置ASP运行环境)

    其实win7下的IIS7配置过程是非常简单的.下面让seo博客来详细的介绍一下win7下配置IIS7环境运行ASP网站的方法,以供初接触者参考   第一次在windows7下配置IIS,虽然有丰富的x ...

  10. Winform之GDI绘制验证码

    主要功能:点击验证码可更换,输入验证码进行登陆 需要导入命名空间System.Drawing; 产生五位的随机字符串: 1 Random random = new Random(); //产生5个随机 ...