JS中的正则

1.正则的概念

正则的使用,相信大家工作中常用到的莫过于,表单验证:验证用户输入的内容是否符合我们设定的规则,例如:邮箱、电话、密码…,当然公司业务不同,手写能力强同学也可以用数据采集:在一堆数据中把我们需要的数据获取到,今天顺带总结一下,例如::

URL传参(问号传参) 从列表页到详细页(或者其他的页面),我们点击不同的列表,在详细页面看到的内容也不同,但是详细页是同一个页面,想要展示不同的内容,需要把URL地址中的,?后面传递进来的参数获取到,通过传递过来的参数值的不一样展示不同的内容
信息采集:把一些数据转变为我们想要的格式,例如:“2018-4-3 12:14:00” ->“2016年04月03日”

今天顺带总结一下;
正则是什么
正则就是用来处理字符串的:匹配字符串的格式是否符合既定的格式(正则的匹配)、把一个字符串中符合既定格式的内容获取到(正则的捕获);
test和exec是正则里面的方法
test->匹配

如:从杂乱的字符串中找数字

	 var str = "asd68asd687as6da78sd123123zcacas"
	    var linshi='';
	    var arr=[]
	    for(var i = 0 ; i < str .length ; i ++){
	        if(str.charAt(i)>=0&&str.charAt(i)<=9){
	            linshi+=str.charAt(i)
	        }else{
	            if(linshi!=''){
	                arr.push(linshi)     
	            }
	        }
	    }
	    if(linshi!=''){
	        arr.push(linshi)     
	    }
	    console.log(arr)

如果使用正则的方式,会是如何呢?
var arr = str.match(/\d+/g);

就可以完成功能

什么是正则?
正则表达式(regular expression)是一个描述字符规则的对象。可以用来检查一个字符串是否含有某个字符,将匹配的字符做替换或者从某个字符串中取出某个条件的子串等。

正则表达式:
正则表达式其实就是一种规则,其实把正则称作规则表达式更为恰当。正则的语法基于一种古老的perl语言。
为什么要用正则呢:
前端往往有大量的表单数据校验工作,采用正则表达式会使得数据校验的工作量大大减轻。常用效果:邮箱,手机号,身份证号等(使用熟练的情况下)

2.正则的创建方式

正则的创建方式:
1.构造函数方式

   var reg1 = new RegExp("a");
    var str = "adassdfsd";
    console.log(str.match(reg1))        //输出匹配a的字符

2.字面量方式,古老的perl语言风格

    var reg2 = /a/;
    console.log(str2.match(reg2));      //输出匹配a的字符

/ / 是正则表达式的标识符

" " 是字符串的标识符
[ ] 是数组的标识符
{ } 是对象的标识符

正则中的修饰符,写在正则表达式后面/的后面:
g表示全局匹配,查找所有
i表示忽略大小写

正则的验证:

var reg = /[0-9]/;
reg.test(str)    //返回为true表示验证成功,false表示失败

3字符串.replace(oldstr, newstr)函数 和 字符串.match(正则)函数

字符串的replace函数的功能:将老字符串替换成新字符串

可以利用此函数,将老字符串表示成正则表达式,对字符串进行替换

如:字符串中的abc替换成“哈哈”,如果正则后面没有g,则只替换一个,如果没有i,则大写不会替换

var str = “abc123abc456abbcdABCefaacbcdbcabc";
var reg = /abc/g;
console.log(str.replace(reg,"哈哈"));

字符串match函数的功能:提取所有的想要的东西
返回一个数组,包含所有符合条件的字符

\d 匹配所有的数字

var reg = /\d/g;
console.log(str.match(reg))    //打印字符串中所有的数字

  //+     若干,量词,表示多少个都可以,至少1个,无上限

var reg = /\d+/g;
console.log(str.match(reg))    //打印字符串中所有的数字,连续

| 或,类似于js中的 ||

var reg = /abc|bbc|cbc|dbc/g
console.log(str.match(reg));   //打印字符串中的abc,bbc,cbc,dbc
var reg = /[a-c]bc/g

[ ] 中元符
var reg = /[a-z]/ //匹配所有字母
[0-9] == \d

^ 排除(除了)
var reg = /[^0-9]/ //表示除了数字之外所有

. 代表所有,不建议使用
var reg = /<.+>/g
console.log(str.replace(reg,"")) //过滤,表示尖括号里面的东西不要,但是?
正则的贪婪定律:
var reg = /<[^<>]+>/g
console.log(str.replace(reg,"”)) //表示尖括号里面的东西不要,真

转义字符:
\d —— [0-9] 数字
\w —— [a-z0-9_] 数字,字母,下划线
\s —— 空白字符(空格)

\D —— [^0-9] 非数字
\W —— [^a-z0-9_] 非数字,字母,下划线
\S —— 非空白字符

量词:限定符,可以指定正则表达式的一个给定组,必须要出现多少次才能满足匹配
* 匹配前面的子表达式零次或多次
+ 匹配前面的子表达式至少一次或多次
? 匹配前面的子表达是零次或一次
{n} 匹配确定n次
{n,} 至少匹配n次
{n,m} 至少匹配n次,最多匹配m次

注:在限定符后紧跟?,则由贪婪匹配变成非贪婪匹配

qq号验证规则:
var reg = /[1-9]\d{4,10}/

固化的规则:0411-6666888
开头为0或者2的或者三位数字加上-开头为非零的八位数字,结尾是1到4的分机号
var reg = /(0\d{2,3}-)?[1-9]\d{7}(-\d{1,4})?/

复杂邮箱的规则:英文数字下划线@一串英文或数子.一串英文
var reg = /\w+@[a-z0-9]+.[a-z]+/i
想要校验怎么办?在正则转义字符前加上\

4正则的方法

正则.test(字符串)方法,返回值是true和false
正则.test(字符串)有一个特性,就是只要字符串的一部分符合要求,那么就会返回true
解决方法:
^开始
$结束

exec()找到了返回数组,找不到反回null

5正则表达式手册

中文版手册

6常用检测方式

1.中文检测
unicode编码中文监测:/1+$/

2.用户名检测
正则:/2{3,16}$/

3.邮箱检测
/^([a-z0-9_.-]+)@([\da-z.-]+).([a-z.]{2,6})KaTeX parse error: Expected 'EOF', got '\d' at position 62: …字母或. /^[a-z\̲d̲]+(\.[a-z\d]+)*…/
可以有多个(字母数字)可有多个可无(.多个(字母数字))@可以多个(数字字母可 有1次可无(-数字字母))可以有多个(1或2个.多个字母)

abc123@123abc.com

4.URL检测
/^(https??/)?([\da-z.-]+).([a-z.]{2,6})([/\w.-])/?$/
有1次或0次(http有1次或0次s : //) 可以多个(数字字母.-) . 2到6位(字母.) 可多个或0个 (可以多个或0个 /数字字母下划线.-) 可0或1次/

http://sh.op-ta.l.baidu.com

5.HTML标签检测
/<([a-z]+)([<]+)(?:>(.)</\1>|\s+/>)$/
<多个(字母)可多个或0个(除了<的所有字符) />
<多个(字母)可多个或0个(除了<的所有字符)>多个任意字符 </重复第一部分的多个字母>

自定义的html标签
/<[^<>]+>/g


  1. \u2E80-\u9FFF ↩︎

  2. a-z0-9_- ↩︎

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值