学习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 相关文章推荐
JQuery获取样式中的background-color颜色值的问题
Aug 20 Javascript
jquery控制背景音乐开关与自动播放提示音的方法
Feb 06 Javascript
JS实现为表格动态添加标题的方法
Mar 31 Javascript
以JavaScript来实现WordPress中的二级导航菜单的方法
Dec 14 Javascript
基于BootStrap Metronic开发框架经验小结【二】列表分页处理和插件JSTree的使用
May 12 Javascript
angular.js 路由及页面传参示例
Feb 24 Javascript
关于javascript作用域的常见面试题分享
Jun 18 Javascript
详解vue中引入stylus及报错解决方法
Sep 22 Javascript
基于JS实现简单滑块拼图游戏
Oct 12 Javascript
js中addEventListener()与removeEventListener()用法案例分析
Mar 02 Javascript
JS typeof fn === 'function' && fn()详解
Aug 22 Javascript
JavaScript实现瀑布流布局的3种方式
Dec 27 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关联数组使用技巧
2015/12/25 PHP
如何使用PHP给图片加水印
2016/10/12 PHP
php版阿里大于(阿里大鱼)短信发送实例详解
2016/11/30 PHP
laravel + vue实现的数据统计绘图(今天、7天、30天数据)
2018/07/31 PHP
laravel实现图片上传预览,及编辑时可更换图片,并实时变化的例子
2019/11/14 PHP
浅析Cookie中的Path与domain
2013/12/18 Javascript
为指定的元素添加遮罩层的示例代码
2014/01/15 Javascript
如何在node的express中使用socket.io
2014/12/15 Javascript
MVC Ajax Helper或Jquery异步加载部分视图
2015/11/29 Javascript
jQuery实现图片局部放大镜效果
2016/03/17 Javascript
详解javascript表单的Ajax提交插件的使用
2016/12/29 Javascript
jQuery extend()详解及简单实例
2017/05/06 jQuery
vue2.0项目中使用Ueditor富文本编辑器示例代码
2017/08/14 Javascript
vue debug 二种方法
2018/09/16 Javascript
javascript中call()、apply()的区别
2019/03/21 Javascript
使用layui监听器监听select下拉框,事件绑定不成功的解决方法
2019/09/28 Javascript
在Vue里如何把网页的数据导出到Excel的方法
2020/09/30 Javascript
layui使用及简单的三级联动实现教程
2020/12/01 Javascript
[00:52]DOTA2齐天大圣预告片
2016/08/13 DOTA
python实现给数组按片赋值的方法
2015/07/28 Python
python删除本地夹里重复文件的方法
2020/11/19 Python
Python批处理删除和重命名文件夹的实例
2018/07/11 Python
python数据结构之线性表的顺序存储结构
2018/09/28 Python
python实现关闭第三方窗口的方法
2019/06/28 Python
使用keras实现BiLSTM+CNN+CRF文字标记NER
2020/06/29 Python
Pycharm调试程序技巧小结
2020/08/08 Python
彻底搞懂python 迭代器和生成器
2020/09/07 Python
Lookfantastic西班牙官网:英国知名美妆购物网站
2018/06/13 全球购物
Ibood荷兰:互联网每日最佳在线优惠
2019/02/28 全球购物
什么是"引用"?申明和使用"引用"要注意哪些问题?
2016/03/03 面试题
工作中的自我评价如何写好
2013/10/28 职场文书
初中政治教学反思
2014/01/17 职场文书
少先队入队活动方案
2014/02/08 职场文书
英语教师求职信范文
2015/03/20 职场文书
关于远足的感想
2015/08/10 职场文书
golang实现浏览器导出excel文件功能
2022/03/25 Golang