学习JavaScript正则表达式


Posted in Javascript onNovember 13, 2015

JavaScript正则表达式学习:

有个在线调试正则的工具。下面的所有示例代码,都可以在codepen上查看到。

1.创建正则表达式

var re = /ab+c/; //方式一 正则表达式字面量

var re = new RegExp("ab+c"); //方式二 RegExp对象的构造函

1)正则表达式字面量在脚本加载后编译。若你的正则表达式是常量,使用这种方式可以获得更好的性能。

2)使用构造函数,提供了对正则表达式运行时的编译。当你知道正则表达式的模式会发生改变, 或者你事先并不了解它的模式或者是从其他地方(比如用户的输入),得到的代码这时比较适合用构造函数的方式。

2.正则表达式中的特殊字符

\    ^    $    *    +    ?    .    (x)    (?:x)    x(?=y)    x(?!y)    x|y    {n}  

{n,m}    [xyz]    [^xyz]    [\b]    \b    \B    \cX    \d    \D    \f    \n    \r   

\s    \S    \t    \v    \w    \W    \n    \0    \xhh    \uhhhh   

3.正则表达式中的方法

有6个,分别是exec、test、match、search、replace和split

exec和test的语法都是regexObj调用,match、search、replace和split的语法都是string调用。

exec:

方法为指定的一段字符串执行搜索匹配操作。它的返回值是一个数组或者 null。语法如下:regexObj.exec(str)

示例代码:

var re = /quick\s(brown).+?(jumps)/ig;
var result = re.exec('The Quick Brown Fox Jumps Over The Lazy Dog');
返回结果:

学习JavaScript正则表达式

test:

一个在字符串中测试是否匹配的RegExp方法,它返回true或false。语法如下:regexObj.exec(str) 

match:

一个在字符串中执行查找匹配的RegExp方法,它返回一个数组或者在未匹配到时返回null。

与exec略有不同,首先是调用方式,math是由字符串调用,而exec是由RegexObj调用。

其次,如果表达式中有“g”标记,那么返回一个匹配的字符串数组,如果没有就会和exec返回的一样。下面这个demo就是有“g”。语法如下:str.match(regexp)

示例代码:

var re = /quick\s(brown).+?(jumps)/ig;
var result = re.exec('The Quick Brown Fox Jumps Over The Lazy Dog');

返回结果:

学习JavaScript正则表达式

search:

一个在字符串中测试匹配的String方法,它返回匹配到的位置索引,或者在失败时返回-1。语法如下:str.search(regexp)

例如上面的示例代码如果是调用search,返回数据就是4。

replace:

一个在字符串中执行查找匹配的String方法,并且使用替换字符串替换掉匹配到的子字符串。语法如下:str.replace(regexp|substr,newSubStr|function[,flags])

var re = /(\w+)\s(\w+)/;
var str = "John Smith";
var result = str.replace(re, "$2, $1");

返回的结果将是:“Smith, John”

split:

一个使用正则表达式或者一个固定字符串分隔一个字符串,并将分隔后的子字符串存储到数组中的String方法。语法如下:str.split([separator[,limit]])

limit就是限制分割后的数组中的个数。下面的是一个demo,但是表达式中有一个是加了括号,一个没加,返回的数据是不一样的。

示例代码:

var re = /(\d)/;
var result = 'Hello 1 word. Sentence number 2.'.split(re);
console.log(result);
var re = /\d/;
var result = 'Hello 1 word. Sentence number 2.'.split(re);
console.log(result);

返回结果:

学习JavaScript正则表达式

4.正则表达式执行返回信息

var myRe = new RegExp("d(b+)d", "g");
var myArray = myRe.exec("cdbbdbsbz");
console.log(myArray);

代码中返回的结果如下:

学习JavaScript正则表达式

学习JavaScript正则表达式

5.正则表达式标志

学习JavaScript正则表达式

var re = /\w+\s/g;//表达式一
var re = new RegExp("\\w+\\s", "g");//表达式二
var str = "fee fi fo fum";
var myArray = str.match(re);
console.log(myArray);

表达式一和表达式二返回的结果是一样的。都是下面的那个数组:

学习JavaScript正则表达式

 以上就是本文的全部内容,希望对大家的学习有所帮助。

Javascript 相关文章推荐
取得传值的函数
Oct 27 Javascript
一个无限级XML绑定跨框架菜单(For IE)
Jan 27 Javascript
自己写的兼容ie和ff的在线文本编辑器类似ewebeditor
Dec 12 Javascript
JavaScript显示当然日期和时间即年月日星期和时间
Oct 29 Javascript
基于javascript制作经典传统的拼图游戏
Mar 22 Javascript
微信小程序中单位rpx和rem的使用
Dec 06 Javascript
基于jQuery制作小图标上下滑动特效
Jan 18 Javascript
在vue 中使用 less的教程详解
Sep 26 Javascript
Vue.js的复用组件开发流程完整记录
Nov 29 Javascript
jquery选择器和属性对象的操作实例分析
Jan 10 jQuery
如何搭建一个完整的Vue3.0+ts的项目步骤
Oct 18 Javascript
Webpack3+React16代码分割的实现
Mar 03 Javascript
jquery实现九宫格大转盘抽奖
Nov 13 #Javascript
jquery动画效果学习笔记(8种效果)
Nov 13 #Javascript
javascript:void(0)点击登录没反应怎么解决
Nov 13 #Javascript
javascript:void(0)是什么意思及href=#与href=javascriptvoid(0)的区别
Nov 13 #Javascript
每天一篇javascript学习小结(Date对象)
Nov 13 #Javascript
有关Promises异步问题详解
Nov 13 #Javascript
以jQuery中$.Deferred对象为例讲解promise对象是如何处理异步问题
Nov 13 #Javascript
You might like
PHP中cookies使用指南
2007/03/16 PHP
php 异常处理实现代码
2009/03/10 PHP
PHP读取网页文件内容的实现代码(fopen,curl等)
2011/06/23 PHP
PHP 常用的header头部定义汇总
2015/06/19 PHP
理解Javascript_02_理解undefined和null
2010/10/11 Javascript
用js实现table单元格高宽调整,兼容合并单元格(兼容IE6、7、8、FF)实例
2013/06/25 Javascript
DOM节点深度克隆函数cloneNode()用法实例
2015/01/12 Javascript
Javascript函数的参数
2015/07/16 Javascript
获取阴历(农历)和当前日期的js代码
2016/02/15 Javascript
JavaScript中判断数据类型的方法总结
2016/05/24 Javascript
Highcharts学习之坐标轴
2016/08/02 Javascript
用JS实现简单的登录验证功能
2017/07/28 Javascript
Angular 容器部署的方法
2018/04/17 Javascript
JS中判断某个字符串是否包含另一个字符串的五种方法
2018/05/03 Javascript
vue+axios+element ui 实现全局loading加载示例
2018/09/11 Javascript
vue服务端渲染添加缓存的方法
2018/09/18 Javascript
利用jquery和BootStrap实现动态滚动条效果
2018/12/03 jQuery
Python实现多行注释的另类方法
2014/08/22 Python
python基础教程之序列详解
2014/08/29 Python
python 中split 和 strip的实例详解
2017/07/12 Python
python使用itchat库实现微信机器人(好友聊天、群聊天)
2018/01/04 Python
Python爬虫实例_城市公交网络站点数据的爬取方法
2018/01/10 Python
python远程邮件控制电脑升级版
2019/05/23 Python
python 读取.nii格式图像实例
2020/07/01 Python
python Yaml、Json、Dict之间的转化
2020/10/19 Python
HTML5在IE10、火狐下中文乱码问题的解决方法
2013/11/18 HTML / CSS
英国皇家邮政海外旗舰店:Royal Mail
2018/02/21 全球购物
亚洲最大的运动鞋寄售店:KicksCrew
2020/11/26 全球购物
Java提供了哪些企业应用编程接口
2015/02/13 面试题
Linux如何修改文件和文件夹的权限
2012/06/27 面试题
仓库班组长岗位职责
2013/12/12 职场文书
遗体告别仪式主持词
2014/03/20 职场文书
校庆口号
2014/06/20 职场文书
2016秋季小学开学寄语
2015/12/03 职场文书
全面盘点MySQL中的那些重要日志文件
2021/11/27 MySQL
redis数据一致性的实现示例
2022/03/18 Redis