复习正则

正则这个东西,说常用也不常用,用到的时候百度一波也够了。早之前对正则还算熟悉,到了后来几乎忘光了。今天重新学一下简单的正则。

正则主要是用来匹配某一个规则的字符串,可以提取和判断。比如最常用的邮箱、电话号码的正则,比如去除前后空格的正则。

JavaScript有一个正则构造函数RegExp,接收两个参数:

new RegExp(pattern, attributes);

pattern表示匹配的规则,attributes是可选的,包含属性 "g"、"i" 和 "m":

i表示不区分大小写:

var reg = new RegExp('a');
console.log(reg.test('abc'));//true
console.log(reg.test('Abc'));//false
var reg = new RegExp('a', 'i');
console.log(reg.test('abc'));//true
console.log(reg.test('Abc'));//true

g表示全局匹配,会全局匹配,而不是找到第一个就返回:

var reg = new RegExp('a');
console.log('abca'.replace(reg, 'd'));//dbca
var reg = new RegExp('a', 'g');
console.log('abca'.replace(reg, 'd'));//dbcd

m这个几乎不常见,表示多行匹配,作用是修改^$的作用。默认状态下,一个字符串只有一个开头^和一个结尾$,如果采用多行匹配,那么每一个行都有一个^合$:

var reg = new RegExp('^a');
console.log(reg.test('bc\nabc'));//false
var reg = new RegExp('^a', 'm');
console.log(reg.test('bc\nabc'));//true
var reg = new RegExp('a$');
console.log(reg.test('bca\nbc'));//false
var reg = new RegExp('a$', 'm');
console.log(reg.test('bca\nbc'));//true

正则表达式有两种创建语法:

创建对象法:

var reg = new RegExp();

直接量语法:

var reg = //;

两种方法的使用和格式没有什么区别,直接量法会更简便。

比如匹配1开头,第二位是2-9,总共11位:

var reg = /^1[2-9]{1}[0-9]{9}/g
console.log(reg.test(15555555555));//true

方括号[]表示集合,大括号{}表示个数。g全局匹配可选。

[0-9]表示0到9

[a-z]表示小写的字母a到z

[A-Z]表示大写的A到Z

[A-z]表示a到z的所有大小写

[abc]方括号里面的任意一个字符

[^a]除了方括号内的字符其他的任意字符

在方括号内还能使用&|

元字符:

正则里面有很多元字符,比如\d表示所有的数字,\S表示所有的非空格字符,\n表示换行符,\r表示回车符等等。

量词:

大于5个var reg = /[0-9]5+/

等于5个var reg = /[0-9]{5}/

5到9个var reg = /[0-9]{}{5,,9}/

量词还有很多,这只是最简单的几个。

属性:

global:是否有全局标志g

IgnoreCase:是否有标志i

Multiline:是否有标志m

lastIndex:整数,开始匹配字符位置

Source:表达式源文本

方法:

正则对象上只有三个方法,我们一般只用test,返回true或false,表示是否符合表达式的规则。

特殊字符:

比如^和$表示开头和结尾,想要使用就要转义\^和\$。比如我们webpack配置loader,以.vue结尾:/\.vue/,就需要把.转义。特殊字符也有好几个。

正则还有很重要的作用就是支持正则的string对象的方法:

Search、match、replace、split。

比如常用的去除空格:

var reg = /\s/g
console.log('a b c d '.replace(reg, '-'));//a-b-c-d-

其实正则最主要就是知道匹配模式igm,限制个数的量词{},集合的方括号[],开头^和结尾$知道了这几个就能写出很多简单的正则。至于其他的特殊字符、元字符等有想要了解的可以看看文档。

(完)

本文分享自微信公众号 - coding个人笔记(gh_2ce38b49dae1),作者:wade

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2019-05-07

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • ES6之变量的解构赋值

    ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构。解构赋值在一些场景下还是很有用的。

    wade
  • 数据类型判断Object.prototype.toString.call

    越学习越觉得基础的不牢固,不懂的,摸棱两可的,学了忘了的,在从入门到放弃的路上一直走着。今天分享一下数据类型判断的方法。

    wade
  • Vue3 UI创建项目

    之前整理了vue3命令行创建项目,vue3还出了图形化管理项目的功能,讲真的,vue越来越简单了,本人认为有点偏向了傻瓜式开发。当然,要开发好项目还是很深的。

    wade
  • ES6(三):变量的解构赋值

    解构赋值语法是一个Javascript表达式,这使得可以将值从数组或属性从对象提取到不同的变量中,文中主要讲数组的解构赋值、对象的解构赋值、字符串的解构赋值、数...

    从入门到进错门
  • 基于UDP(面向无连接)的socket编程

    本程序是基于windows socket的套接字库实现网络编程; 当WSAStartup函数调用成功后,在程序的最后都需要相应的调用WSACleanup函数 ...

    战神伽罗
  • ES6中的解构赋值

    ES6解构:es6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称之为解构。

    刘亦枫
  • 【ES6基础】解构赋值(destructuring assignment)

    我们经常可以在其他编程语言(如GO语言)中看到多返回值这种特性,因为在很多实际场景中,函数的返回值中,函数的返回值并不只有一个单一的值。ES6之前,并没有可以直...

    前端达人
  • React源码解析之updateHostComponent和updateHostText

    还是在 React源码解析之workLoop 中,有一段HostComponent和HostText的更新:

    进击的小进进
  • XLNet模型第一作者杨植麟:NLP落地的四个技术阶段

    近日,Recurrent.ai 联合创始人、XLNet 模型第一作者杨植麟,受邀在 CSDN 主办的 2019 AI 开发者大会发表演讲。在演讲中,杨植麟首先从...

    AI科技大本营
  • Steam 2016开发者大会今天开幕,新的VR外设即将亮相

    VRPinea

扫码关注云+社区

领取腾讯云代金券