浅谈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制作的产品广告效果
Dec 08 Javascript
jquery怎样实现ajax联动框(一)
Mar 08 Javascript
js实现连续英文字符自动换行兼容ie6 ie7和firefox
Sep 06 Javascript
js修改原型的属性使用介绍
Jan 26 Javascript
Javascript数组操作函数总结
Feb 05 Javascript
js验证上传图片的方法
May 12 Javascript
jquery表单插件Autotab使用方法详解
Jun 24 Javascript
实例详解jQuery的无new构建
Aug 02 Javascript
JQuery 获取Dom元素的实例讲解
Jul 08 jQuery
bootstrap-table实现服务器分页的示例 (spring 后台)
Sep 01 Javascript
js 实现复选框只能选择一项的示例代码
Jan 23 Javascript
js实现坦克移动小游戏
Oct 28 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
什么是MVC,好东西啊
2007/05/03 PHP
PHP编实现程动态图像的创建代码
2008/09/28 PHP
thinkPHP+phpexcel实现excel报表输出功能示例
2017/06/06 PHP
jQuery load方法用法集锦
2011/12/06 Javascript
JS将光标聚焦在文本最后的实现代码
2014/03/28 Javascript
javascript中定义类的方法汇总
2014/12/28 Javascript
Node.js 异步编程之 Callback介绍(一)
2015/03/30 Javascript
JavaScript取得WEB安全颜色列表的方法
2015/07/14 Javascript
详解微信小程序开发之——wx.showToast(OBJECT)的使用
2017/01/18 Javascript
jQuery基于ajax方式实现用户名存在性检查功能示例
2017/02/10 Javascript
HTML的select控件美化
2017/03/27 Javascript
详解nodejs实现本地上传图片并预览功能(express4.0+)
2017/06/28 NodeJs
form表单序列化详解(推荐)
2017/08/15 Javascript
vue中使用带隐藏文本信息的图片、图片水印的方法
2020/04/24 Javascript
JavaScript/TypeScript 实现并发请求控制的示例代码
2021/01/18 Javascript
[49:58]完美世界DOTA2联赛PWL S3 Magma vs DLG 第一场 12.18
2020/12/19 DOTA
使用Python3制作TCP端口扫描器
2017/04/17 Python
python数据结构学习之实现线性表的顺序
2018/09/28 Python
详解Python函数式编程—高阶函数
2019/03/29 Python
python使用time、datetime返回工作日列表实例代码
2019/05/09 Python
Python3并发写文件与Python对比
2019/11/20 Python
python实现图片横向和纵向拼接
2020/03/05 Python
Python基于stuck实现scoket文件传输
2020/04/02 Python
CSS3 animation实现逐帧动画效果
2016/06/02 HTML / CSS
GIVENCHY纪梵希官方旗舰店:高定彩妆与贵族护肤品
2018/04/16 全球购物
华硕新加坡官方网上商店:ASUS Singapore
2020/07/09 全球购物
Java语言程序设计测试题改错题部分
2014/07/22 面试题
2014年国培研修感言
2014/03/09 职场文书
老人祝寿主持词
2014/03/28 职场文书
厕所文明标语
2014/06/11 职场文书
行政申诉状范文
2015/05/20 职场文书
受欢迎的自荐信,就这么写!
2019/04/19 职场文书
Vue通过懒加载提升页面响应速度
2021/05/10 Vue.js
python tkinter Entry控件的焦点移动操作
2021/05/22 Python
【海涛教你打DOTA】虚空假面第一视角骨弓3房29杀
2022/04/01 DOTA
开发微信小程序之WXSS样式教程
2022/04/18 HTML / CSS