浅谈Javascript常用正则表达式应用


Posted in Javascript onMarch 08, 2019

模式修饰符的可选参数

  • i: 忽略大小写
  • g: 全局匹配
  • m: 多行匹配
  • /hello/: 两个反斜杠是正则表达式的字面量表示法

两个测试方法

test

const test = new RegExp('hello world', 'ig');
console.log(test.test('hello world')); // true

exec

返回的是数组,有就返回数组的值,没有返回为null

const test = new RegExp('hello world', 'ig');
console.log(test.exec('hello')); // null

四个正则表达式方法

match(pattern)

将所有匹配的字符串组合成数组返回

const pattern=/Box/ig;
const str="This is a Box! The is a box!";
console.log(str.match(pattern));

search(pattern)

返回字符串中pattern开始位置,忽略全局匹配

const pattern=/Box/i;	//
const str="This is a Box! The is a box!";
console.log(str.search(pattern)); // 10

replace(pattern)

替换匹配到的字符串

const pattern=/Box/ig;
const str="This is a Box! The is a box!";
console.log(str.replace(pattern,'Tom'));

split(pattern)

返回字符串指定pattern拆分数组

const pattern = / /ig;	//空格
const str = "This is a Box! The is a box!";
console.log(str.split(pattern)); //以空格进行分割,返回的是数组
// 输出结果
// [ 'This', 'is', 'a', 'Box!', 'The', 'is', 'a', 'box!' ]

匹配模式

\w表示a-zA-Z_
锚元字符匹配(^ $) ^强制收匹配 $强制尾匹配,并且只匹配一个

const pattern=/^[a-z]oogle\d$/;
const str="aoogle2";
console.log(pattern.test(str)); // true

注意: ^符号在[]里面表示 非 在外边表示强制首匹配,并且只匹配一个 要想匹配多个值,使用+
\b表示到达边界

|表示匹配或选择模式

const pattern=/baidu|google|bing/; //匹配或选择其中某个字符,不是相等,包含的意思
const str = "baidu a google"; 
console.log(pattern.test(str)); //返回true

常用正则表达式

检查邮政编码

const pattern = /^[1-9]{1}[0-9]{5}$/;
const str = "122534"; //共6位数,第一位不能为0
console.log(pattern.test(str)); // true

压缩包后缀名
\w等于a-zA-Z0-9_ 使用^限定从首字母匹配 .是特殊符号需要\n进行转义
|选择符必须使用()进行分组

const pattern = /^[\w]+\.(zip|gz|rar)$/; 
const str="a12_.zip"; //文件名 字母_数字.zip,gz,rar
console.log(pattern.test(str)); // true

删除多余空格

方法一: 使用replace只匹配一个,所以使用+匹配多个

var pattern=/^\s+/; 
 var str=" google ";
 var result=str.replace(pattern,'');
 pattern=/\s+$/;
 result=result.replace(pattern,'');

方法二: (.+)贪婪模式,使用惰性模式,后面的空格不让匹配

var pattern=/^\s+(.+?)\s+$/;
 var str=" google ";
 var result=pattern.exec(str,'')[1];

 console.log('|'+result+'|');

方法三: (.+)贪婪模式,改为惰性模式,使用分组模式,只取匹配的内容

var pattern=/^\s+(.+?)\s+$/;
 var str=" google ";
 var result=str.replace(pattern,'$1'); //使用分组模式

 console.log('|'+result+'|'); // |google|

简单邮箱验证

var pattern=/^([\w\.\_]+)@([\w\_]+)\.([a-zA-Z]){2,4}$/;
var str="qzfweb@gmail.com";
console.log(pattern.test(str)); // true

以上所述是小编给大家介绍的Javascript常用正则表达式应用讲解详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jquery获取元素值的方法(常见的表单元素)
Nov 15 Javascript
jquery append 动态添加的元素事件on 不起作用的解决方案
Jul 30 Javascript
js实现的动画导航菜单效果代码
Sep 10 Javascript
js实现的鼠标滚轮滚动切换页面效果(类似360默认页面滚动切换效果)
Jan 27 Javascript
使用jQuery制作遮罩层弹出效果的极简实例分享
May 12 Javascript
picLazyLoad 实现图片延时加载(包含背景图片)
Jul 21 Javascript
纯js实现画一棵树的示例
Sep 05 Javascript
vue实现nav导航栏的方法
Dec 13 Javascript
解决在layer.open中使用时间控件laydate失败的问题
Sep 11 Javascript
three.js 制作动态二维码的示例代码
Jul 31 Javascript
vue组件添加事件@click.native操作
Oct 30 Javascript
如何使用原生Js实现随机点名详解
Jan 06 Javascript
validform表单验证的实现方法
Mar 08 #Javascript
webpack4.x下babel的安装、配置及使用详解
Mar 07 #Javascript
Webpack4 使用Babel处理ES6语法的方法示例
Mar 07 #Javascript
深入理解react 组件类型及使用场景
Mar 07 #Javascript
如何优雅地在vue中添加权限控制示例详解
Mar 07 #Javascript
node链接mongodb数据库的方法详解【阿里云服务器环境ubuntu】
Mar 07 #Javascript
Vue中的情侣属性$dispatch和$broadcast详解
Mar 07 #Javascript
You might like
PHP CKEditor 上传图片实现代码
2009/11/06 PHP
PHP+Mysql+Ajax+JS实现省市区三级联动
2014/05/23 PHP
Zend Framework实现多文件上传功能实例
2016/03/21 PHP
js跟随滚动条滚动浮动代码
2009/12/31 Javascript
jQuery Autocomplete自动完成插件
2010/07/17 Javascript
easyui datagrid 键盘上下控制选中行示例
2014/03/31 Javascript
javascript抽象工厂模式详细说明
2014/12/16 Javascript
轻松创建nodejs服务器(8):非阻塞是如何实现的
2014/12/18 NodeJs
HTML+CSS+JS实现完美兼容各大浏览器的TABLE固定列
2015/04/26 Javascript
js贪吃蛇网页版游戏特效代码分享(挑战十关)
2015/08/24 Javascript
详解JavaScript基于面向对象之继承实例
2015/12/16 Javascript
jQuery form插件之ajaxForm()和ajaxSubmit()的可选参数项对象
2016/01/23 Javascript
JavaScript的Ext JS框架中的GridPanel组件使用指南
2016/05/21 Javascript
Vue中使用vux的配置详解
2017/05/05 Javascript
值得分享和收藏的xmlplus组件学习教程
2017/05/05 Javascript
Material(包括Material Icon)在Angular2中的使用详解
2018/02/11 Javascript
JavaScript继承与多继承实例分析
2018/05/26 Javascript
JS中使用cavas截图网页并解决跨域及模糊问题
2018/11/13 Javascript
vue中axios请求的封装实例代码
2019/03/23 Javascript
javascript使用正则表达式实现注册登入校验
2020/09/23 Javascript
Python中decorator使用实例
2015/04/14 Python
python一键升级所有pip package的方法
2017/01/16 Python
Python + selenium自动化环境搭建的完整步骤
2018/05/19 Python
Python编程图形库之Pillow使用方法讲解
2018/12/28 Python
使用matlab或python将txt文件转为excel表格
2019/11/01 Python
如何在windows下安装配置python工具Ulipad
2020/10/27 Python
python实现KNN近邻算法
2020/12/30 Python
CSS3中的弹性布局em运用入门详解 1em等于多少像素
2021/02/08 HTML / CSS
成人大专自我鉴定范文
2013/10/19 职场文书
写求职信有哪些注意事项
2014/05/08 职场文书
购房协议书范本
2014/10/02 职场文书
放弃继承权公证书
2015/01/23 职场文书
家属慰问信
2015/02/14 职场文书
三好学生主要事迹怎么写
2015/11/03 职场文书
golang协程池模拟实现群发邮件功能
2021/05/02 Golang
整理Python中常用的conda命令操作
2021/06/15 Python