什么是正则表达式,怎么写,使用场景等都在这里了

一、正则表达式

规则表达式(regular expression)

  1. 是一个对象,叫正则对象
  2. 是一个强大的字符串匹配和处理工具(除了处理字符串,其他的什么都做不了)
  3. 它是火星文,一般人很难理解(程序界的摩斯码)
  4. 它还是一种思维方式
  5. 容易学,但是也非常容易忘记

二、使用场景

  1. 字符串匹配和替换
  2. 表单验证
    1、比如网站要求你输入的QQ号为5~12位数字
    2、电话号码必须是010-12345678或0731-88032131这样的字符串
    3、比如Email邮箱验证
    4、比如过滤关键字或者过滤HTML标签
    5、比如发表评论的时候只允许中文评论
    6、比如去除字符串首尾空格
    ---正则是不是必须---
    正则虽然不是必须的,但是用了正则后,会让你的代码更少,效率更高,可读写更好    
    

三、正则表达式要怎么写

语法(公式)

  1. 使用new关键字(了解)
    var reg=new RegExp('正则规则','属性');//属性可选
    1.正则规则
        如何写正则,即后面要重点学习的
    2.属性
        i:ignore  忽略大小写
        g:Global  全局
            "这是我的QQ:566666,说了的国家你说大概,你的QQ是:882423,马化腾的是10000";
            如果不添加g,则只会找一个,添加了,才会找所有QQ
        m:multiple   
           多行搜索(很少用)
        以上属性可以都不写,也可以只写1个,或全部
    //比如:
    var reg=new RegExp('[1-9]\d{4,9}') 
    var reg=new RegExp('[1-9]\d{4,9}','ig');   
    
  2. 使用字面量(常用的)
    var obj={}
    var arr=[]
    --
    var reg=/正则规则/属性;
    比如:
    var reg=/[1-9]\d{4,9}/;
    var reg=/[1-9]\d{4,9}/igm;
    

四、正则规则怎么写(法律规则)

/^1[3-9]\d{9}$/ 这是手机的正则规则,相当于是要学的全部。

  1. 关键字原文-最简单的正则写法
    var reg=/abc/;//表示匹配abc3个字母
    var reg=/cctv/;//
    var reg=/我们/;//
    var reg=/1/;
    
  2. 区间
    []表示范围
    var reg=/[123]/;//表示1或2或3中任意一个
    var reg=/[0-9]/;//表示0-9中的任意一个
    var reg=/[a-z]/;//
    var reg=/[a-zA-Z]/;//a-z,A-Z中的任意一个
    var reg=/[0-9a-z-_]/;//表示需要出现0-9,a-z和_-
    var reg=/[\u4e00-\u9fa5]/;//表示是中文
    
  3. 转义字符(升级版的区间)
    1. \d   digit匹配所有的数字,相当于[0-9]
       \D   表示非数字,即\d的反面,相当于[^0-9]
    2. \w   word 匹配所有的字母、数字和下划线等[0-9a-zA-Z_]
       \W   取反,表示非字母、数字、下划线[^0-9a-zA-Z_]
    3. \s   space,表示空格
       \S   表示非空格
        替换字符串空格
    4. .  表示匹配任意字符,慎用
       如果要匹配.本身,如何做:需要添加\.表示不转义
    
  4. 量词,修饰它前面的正则,表示可以出现的次数
    1. {n,m}  {2,4}  刚好出现n到m次
    2. {n}   {2}  刚好出现n次
    3. {n,}  {2,}  最少2次
    4. *  任意次,即可有可无,多了不限,也可以这样表示 {0,}
    5. ?  表示0次或1次  /\d?\d/;  0-99   表示:{0,1}
    6. +  表示至少1次  等价于{1,}
    ---写下QQ--
    QQ规则:5-10位数字都可以,但是第一位不能是0
    var reg=/[1-9]\d{4,9}/;
    
    
  5. 以什么开头、以什么结束, 修饰作用(主要用于表单验证中)
    1.如果^写在/的后面1位,则表示以什么开头,用来修饰它后面的正则规则
    var reg=/^\d/; //表示要以数字开头
    
    2. 如果$写在最后面,即/的前面一位,表示以什么结束,修饰它前面的那个正则
    var reg=/\s+$/g;//
    var str='asdga     ';//'asdga'
    str.replace(reg,'');//
    
    //匹配前面的空格,并去掉
    var reg=/^\s+|\s+$/;//
    var str='  asgd   asdg   ';
    str.replace(reg,'');//'asgd   asdg'
    
  6. 取反-修饰作用
    ^用在区间中,则表示取反
    /[^123]/;//
    

    小练习:

//1.写我,我们,你,你们,他,他们的正则,并将下面的这段话的对应的文字替换为*
var str='我们一起去旅游好吗?我带上你,你带上钱。我们可以一起坐火车,也可以坐汽车。我带上我爱吃的零食,你带上你爱看的漫画'
var reg=/[我你他们]/g;
str.replace(reg,'*');

//2.将以下段落中所有的QQ号找出来
var str="这是我的QQ:566666,说了的国家你说大概,你的QQ是:882423,马化腾的是10000";
//写正则
var reg=/[1-9]\d{4,9}/g;
 //执行(用那4个执法者)
str.match(reg);//['566666','882423','10000']

五、正则规则如何使用(正则的执行者)

  1. 字符串的3个方法(匹配和替换)a. replace 替换
    "字符串".replace(正则,'新的内容');
    //比如:
    "经常看CCTV能强身壮体".replace(/cctv/i,'****');
    //输出:
    "经常看****能强身壮体"
    //比如:
    "经常看CCTV能强身壮体,要经常看cctv哦".replace(/cctv/ig,'****');
    //注意:如果要匹配多个,记得加g,因为正则有个惰性原则
    

    b. search 搜索是否有,如果有则返回下标,类似于indexOf方法

    "字符串".search(正则);//如果字符串中有正则匹配的,则返回下标
    //需求,看看下面这句话有没有cctv
    "经常看CCTV能强身壮体,cctv真好".search(/cctv/ig);//3
    //注意:只会返回第一个出现的下标,即使符合条件的有多个
    

    c. match 匹配 搜索是否有,如果有则返回到一个数组中

    "字符串".match(正则);
    //需求,看看下面这句话有没有cctv,并拿出来
    "经常看CCTV能强身壮体,cctv真好".match(/cctv/ig);//3
    
  2. 正则对象的1个方法(表单验证)
    /正则/.test('要处理的字符串'); //看看这个要处理的字符串中有没有符合正则规则的,如果有,则返回true,否则返回false
    //需求,看看下面的文字中有没有指定的符合正则的文字,如果有,则true
    /cctv/.test('cctv真好,我希望来cctv工作,离家近,工资高,还不累')
    

     

今日单词

  1. test 测试
  2. replace 替换
  3. match 匹配
  4. search 搜索
此资源下载链接已被无情的隐藏,请输入验证码解锁:
验证码

请关注本站公众号回复“验证码”,获取验证码。

在微信里搜索“WEB前端全栈圈”或者“imqdcn”或者微信扫描二维码都可以关注微信公众号

WEB前端全栈圈
除特别声明外, 本站所有内容皆为原创,未经许可,禁止转载。转载时请务必以超链接形式标明文章出处和作者信息
  • 1,239
(0)
打赏 微信扫一扫 微信扫一扫
                       

关于作者:

web前端老罗

贡献:已经在WEB前端圈发表90篇文章了

简介:前端老罗是一位拥有多年web前端开发经验、管理经验、教学经验的实战派全栈工程师。目前在某名企任职WEB前端技术教官。加我微信:imqdcnn可提供开发、技术咨询、答疑、直播讲座等服务

Ta的专栏 | Ta的站点 | 其他SNS

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注

关于WEB前端圈

我是前端人(imqd.cn)愿景是不管你是想学习前端还是一名专业的WEB前端工程师在这里都能找到你想要的物料。定位为前端人学习进步的一个平台。在这里你能找到前端学习笔记、教学视频资源、案例、前后端分离、前端框架、低代码平台、可视化数据、多端开发、全栈开发等跟前端有关的一切资源!

关于站长:WEB前端老罗(罗老师)是一位拥有多年web前端开发经验、管理经验、IT培训教学经验的实战派全栈工程师。目前在某名企任职WEB前端技术教官。右边加我微信可提供开发、技术咨询、答疑、直播讲座等服务

WEB前端圈二维码

右边添加老罗微信一对一免费私聊
拉你加入官方微信答疑群

To top