前端培训-初级阶段(13) - 正则表达式

前端最基础的就是 HTML+CSS+Javascript。掌握了这三门技术就算入门,但也仅仅是入门,如今前端开发的定义已经远远不止这些。前端小课堂(HTML/CSS/JS),本着提高技术水平,打牢基础知识的中心思想,咱们开课啦(每周四)。前端

该文为前端培训-初级阶段(1三、18)的补充内容 (介绍了 ECMAScript 历史,ES6 经常使用点)。正则表达式

本文介绍ECMAScript基础知识segmentfault

  1. 前端培训-初级阶段(13) - ECMAScript (语法、变量、值、类型、运算符、语句)
  2. 前端培训-初级阶段(13) - ECMAScript (内置对象、函数)
  3. 前端培训-初级阶段(13) - 类、模块、继承

基础内容知识咱们会用到。默认已读。dom

咱们要讲什么?

  1. 正则表达式基本的关键词
  2. 正则表达式一些进阶用法(预查断言)
  3. 常见正则
  4. 实战场景

正则表达式基本的关键词

  1. 声明一个正则表达式
    1)var reg=new RegExp('规则','条件');
    由于规则是一个字符串,因此能够拼接,好比new RegExp(['违规','骂人','涉黄','涉政'].join('|')).test('正经人涉黄')在这个场景当中,咱们须要根据其余词库,来生成过滤正则。

    2)var reg=/规则/条件;
    通常来讲咱们使用这个,方便快捷函数

  2. 条件学习

    关键词 说明 用法
    i ignore 忽略大小写 通常用在标签匹配好比 <img><IMG>
    g global 全局 通常用在须要匹配多个区域的时候好比违规词语要替换成**
    m multiline 多行 这个用的比较少
  3. 规则
    里面的全部都是错的,须要本身替换成半角的|spa

    关键词 匹配项 说明 用法
    字符串 常规字符 直接填入你要匹配的字符便可,关键词须要转义 '骂人,骂人的话'.replace(/骂人/g, '**')
    \d 数字0-9的缩写,也等价于[0-9] '0313-0000000'.replace(/\d/g, '*')
    \w 单词,也等价于[a-zA-Z0-9_] 'tel: 0313-;URI: lilnong.top'.replace(/\w/g, '*')
    \s 任何不可见字符,包括空格、换行等。等价于[ \f\n\r\t\v] ' \f\n\r\t\v'.replace(/\s/g, '*')
    \b 单词边界,相似于$ 'lists list'.replace(/s\b/g, '')
    \D \W \S \B 等同于上面小写的取反
    \num 匹配以前的分组num为索引,能够用来查找重复字符 'abbcccddddeffffffff'.match(/(\w)\1+/g)
    ( ) 分组 能够用来给\num匹配,也能够用来给match函数使用
    或 用来标识关键字匹配其中的便可 'x + y = ?'.replace(/x|y/g,()=>Math.random()*50>>0)
    [xyz] 字符集合 比较经常使用里面能够放上面的关键词 'x + y = ?'.replace(/[xy]/g,()=>Math.random()*50>>0)
    . 除“\n”和"\r"以外的任何单个字符。

    上面介绍了常见的规则,其实还有一些匹配的量词code

    关键词 匹配项 说明 用法
    ^ 标识开始 'onchange'.match(/^on\w+/)
    $ 标识结束 'abc.mp4.avi'.match(/\.\w+$/)
    * 0或多个,等价于{0,} 'abbccc'.match(/a*/g)
    + 1或多个,等价于{1,} 'abbccc'.match(/a+/g)
    ? 0活1个,等价于{0,1} 'abbccc'.match(/a?/g)
    {n,m} n和m能够省略一个,也能够都写上,限定个数

正则表达式一些进阶用法(预查)

js中的支持的不是很好对象

  1. 将简单的网址:www.abc.com中的中间部分abc提取出来
  2. 正向零宽先行断言 'https://segmentfault.com/write'.match(/\w+(?=\.com)/)

3.blog

常见正则

  1. 邮箱 /\w+@\w+(\.\w+)+/
  2. 手机号 /^1\d{10}$/.test('15075754545')

实战

  1. 匹配歌词文件

    clipboard.png

  2. 获取URL中的参数
    location.search.match(/[?&]q=[^&]*/) q为key

后记

主讲人文章-2019.04.18

我虽然忙没写出来,可是学习咱们是一直在作的。赶赶进度。

相关文章
相关标签/搜索