【JavaScript 5—基础知识点】:正则表达式(笔记)
一、总体概览
1.1,什么是正则
又称正规表示法、常规表示法(英语:Regular Expression,在代码中常简写为regex、regexp或RE),计算机科学的一个概念。正则表达式使用单个字符串来描述、匹配一系列符合某个句法规则的字符串。在很多文本编辑器里,正则表达式通常被用来检索、替换那些符合某个模式的文本。
简单说来,就是一个描述字符模式的对象。
1.2,正则的作用
正则表达式主要用来验证客户端的输入数据。
1.3,正则的好处
客户端验证,可以节约大量的服务器端的系统资源,并且提供更好的用户体验。
1.4,相关知识(图示)
说明:正则的表达式,即正则的字符所代表的含义,将在文章最后通过附录的方式给出。从图中可以很明显的看出,正则表达式就是一个对象,有其声明方式,属性和方法等。特别的是,这个对象是一个字符模式。
二、例子说明
2.1,new运算符+test()方法
<span style="font-family:KaiTi_GB2312;font-size:18px;">//使用new运算符的test方法
var pattern = new RegExp("test", "i");//创建正则模式,不区分大小写
var str = "this is a Test";//创建要比对的字符串
alert(pattern.test(str));//结果:true</span>
说明:test()方法是测试正则表达式的一个方法,它和exec()方法在整体上都是一样的,只是test()方法返回布尔值,而exec()方法返回匹配到的字符。
2.2,字面量+exec()方法
<span style="font-family:KaiTi_GB2312;font-size:18px;">//使用字面量方式的exec方法
var pattern = /test/i;//创建正则模式,不区分大小写
var str = "this is a Test";//创建要比对的字符串
//alert(pattern.test(str));//结果:true
alert(pattern.exec(str));//结果:Test
</span>
说明:对比使用test()方法和exec()方法返回的不同结果
2.3,match()方法的使用
<span style="font-family:KaiTi_GB2312;font-size:18px;">//使用match方法获取匹配数组
var pattern = /test/ig;//不区分大小写,全局模式
var str = "this is a Test!,that is not a Test";
//alert(str.match(pattern));//匹配到两个,Test,Test
alert(str.match(pattern).length);//结果:2</span>
2.4,构造(静态)属性
<span style="font-family:KaiTi_GB2312;font-size:18px;">//使用静态属性
var pattern = /(t)est/;//圆括号分组,lastParen
var str = "this is test!";
pattern.test(str);//必须执行一下,静态属性有效
//alert(RegExp.input);//this is test!
//alert(RegExp.leftContext);//this is +空格
//alert(RegExp.rightContext);//!
//alert(RegExp.lastMatch);//test
alert(RegExp.lastParen);//t</span>
说明:直接调用,无须声明,但是使用静态属性会出现一些兼容性的问题,所以需要使用实例属性。
2.5,实例属性
<span style="font-family:KaiTi_GB2312;font-size:18px;">//使用实例属性
var pattern = /test/ig;
//alert(pattern.global);//true,是否全局
//alert(pattern.ignoreCase);//true,是否忽略大小写
//alert(pattern.multiline);//false,是否支持换行
alert(pattern.lastIndex);//0,下次的匹配位置
alert(pattern.source);//test,正则表达式的源字符串</span>
说明:必须声明正则模式,才可以调用
2.6,贪婪和惰性
<span style="font-family:KaiTi_GB2312;font-size:18px;">//贪婪和惰性
//var pattern = /1(.*)1/;//使用了贪婪
var pattern = /1(.*?)1/g;//使用惰性,必须开启全局,多次匹配
var str = "1test1 1test1 1test1";//匹配到 test1 1test1 1test
//document.write(str.replace(pattern, "<strong>$1</strong>"));//结果:<strong>test1 1test1 1test</strong>
//alert(pattern.exec(str));//结果:1test1 1test1 1test1,test1 1test1 1test
document.write(str.replace(pattern, "<strong>$1</strong>"));//结果:<strong>test test test</strong></span>
三、个人感受
在学习正则表达式的过程中,对于这个正则表达式很有想法的。比如说,在ASP.net里面,有验证控件验证文本输入。而在这里,可以用正则表达式验证文本输入,这两者到底有什么关系,还有就是在具体的实际应用中,需要怎样去灵活的使用呢,这些都需要进一步的去了解。下篇博客再说。
附录:正则表达式
|
符号 |
含义 |
|
|
单个字符与数字 |
||
|
. |
匹配任意字符(除换行符之外) |
|
|
[^a-z0-9] |
匹配不在方括号中的任意字符 |
|
|
[a-z0-9] |
匹配方括号中的任意字符 |
|
|
\d |
匹配数字 |
|
|
\D |
匹配非数字 |
|
|
\W |
匹配非字母 |
|
|
\w |
匹配字母 |
|
|
空白字符 |
||
|
\0 |
匹配null字符 |
|
|
\b |
匹配空格字符 |
|
|
\f |
匹配禁止符 |
|
|
\n |
匹配换行符 |
|
|
\r |
匹配回车符 |
|
|
\s |
匹配空白字符、空格、制表符或换行符 |
|
|
\S |
匹配非空白字符 |
|
|
\t |
匹配制表符 |
|
|
定位符 |
||
|
^ |
行首匹配 |
|
|
$ |
行尾匹配 |
|
|
\A |
只匹配字符的开始处 |
|
|
\b |
匹配单词边界,词在[]内无效 |
|
|
\B |
匹配非单词边界 |
|
|
\G |
匹配当前搜索的开始位置 |
|
|
\Z |
匹配字符串结束处 |
|
|
\z |
只匹配字符串结束处 |
|
|
限定符 |
||
|
X? |
匹配0个或1个x |
|
|
X* |
匹配0个或任意多个x |
|
|
X+ |
匹配至少1个x |
|
|
X{m,n} |
匹配最少m个,最多n个x |
|
|
分组 |
||
|
(?:x) |
匹配x但不记录匹配结果 |
|
|
X(?=y) |
当x后接y时,匹配x |
|
|
X(?!y) |
当x 后不是y时匹配x |
|
|
引用 |
||
|
\1……\9,$1……$9 |
返回9个在模式匹配期间找到的,最近保存的部分 |
|
|
或模式 |
||
|
X|y|z |
匹配x或y或z |
|
【JavaScript 5—基础知识点】:正则表达式(笔记)的更多相关文章
- JavaScript语言基础知识点图示(转)
一位牛人归纳的JavaScript 语言基础知识点图示. 1.JavaScript 数据类型 2.JavaScript 变量 3.Javascript 运算符 4.JavaScript 数组 5.Ja ...
- JavaScript语言基础知识点图示
原文:JavaScript语言基础知识点图示 一位牛人归纳的JavaScript 语言基础知识点图示. 1.JavaScript 数据类型 2.JavaScript 变量 3.Javascript 运 ...
- JavaScript 语言基础知识点总结
网上找到的一份JavaScript 语言基础知识点总结,还不错,挺全面的. (来自:http://t.cn/zjbXMmi @刘巍峰 分享 )
- JavaScript 语言基础知识点总结(思维导图)
JavaScript 数组 JavaScript 函数基础 Javascript 运算符 JavaScript 流程控制 JavaScript 正则表达式 JavaScript 字符串函数 JavaS ...
- 【JavaScript 6—基础知识点】:正则表达式(应用)
导读:其实,我不像大家一样,从一开始就重视着正则表达式,我甚至都觉得好浪费时间浪费精力,都没用的.因为,如果我要判断是不是为数字,我可以使用Numberic()方法,如果要去空格的话,使用trim() ...
- 一套最全的JavaScript 语言基础知识点总结(思维导图10张)
1.DOM基础操作 2.数组基础 3.函数基础 4.运算符 5.流程控制语句 6.正则表达式 7.字符串函数 8.数据类型 9.变量 10.window对象
- 【JavaScript 8—基础知识点】:DOM
一.总体概述 1.1,什么是DOM DOM(Document Object Model):D(文档):整个web加载的网页文档:O(对象):类似于window对象之类的东西,可以调用属性和方法,在这里 ...
- 【JavaScript 7—基础知识点】:BOM
一.基础知识 1.1,什么是BOM BOM(browser object model):也叫浏览器对象模型,它提供了很多对象,用于访问浏览器的功能.BOM缺少规范,每个浏览器提供商又按照自己想法去扩展 ...
- 【JavaScript 4—基础知识点】:函数
导读:函数这个东西,从VB开始就一直在用,不过那时候一般写不出来自己的函数或者类,觉得最高大上的,就是调用API函数了.现在,学习到了JavaScript,总结总结函数,显得很有必要.这篇文章,就从最 ...
随机推荐
- 一起来学Spring Cloud | 第三章:服务消费者 (负载均衡Ribbon)
一.负载均衡的简介: 负载均衡是高可用架构的一个关键组件,主要用来提高性能和可用性,通过负载均衡将流量分发到多个服务器,多服务器能够消除单个服务器的故障,减轻单个服务器的访问压力. 1.服务端负载均衡 ...
- 1102 采药 2005年NOIP全国联赛普及组
1102 采药 2005年NOIP全国联赛普及组 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 黄金 Gold 题目描述 Description 辰辰是个天资聪颖的孩子 ...
- Yii2.0 Cookies机制和使用方法
在实际的项目开发过程中,用到了Yii2.0 Cookies机制!但是遇到一个十分奇葩的问题,同一个YII框架,backend下Cookies能够正常存储于客户端,但是frontend始终不行.文章的最 ...
- Selenium私房菜系列9 -- 我遇到的问题及解决问题的方法
Selenium私房菜系列10 -- 我遇到的问题及解决问题的方法
- Azure 进阶攻略 | 关于Java 和事件中心的那不得不说的事
物联网技术辣么火,虽然之前有说过不少,但今天,仍有一个憋在我心里已久,不得不说的话题:基于Azure 的物联网平台必不可少,你可能已经在使用,但也许并没有意识到的服务:Azure 事件中心. 啊?事件 ...
- javascript基本类型和引用类型,作用域和内存问题
基本类型(null.undefined.boolean.number.string)和引用类型(Object 对象) 1 基本类型:只能不存一个值,一种类型:从一个变量向另一个变量复制基本类型的值, ...
- OS X快捷键小技巧
退出command+Q,关分页Command+W,刷新Command+R,新开分页Command+T 全屏 ctrl+command+F 每个Mac使用者都知道点击下窗口左上角黄色圆形的按钮就可以最小 ...
- SpringBoot入门,新建SpringBoot项目
一.在Spring Initializr中创建初始化项目 https://start.spring.io/ 二.通过maven导入Idea中(解压后的项目) 解压文件 黄色的为项目需要的真正的代码 , ...
- jpeg和jpg的区别是什么
JPG是JPEG的简写,jpg是后缀名,jpeg既可作为后缀名,又能代表文件格式:JPG——JPEG文件格式. 我们在系统自带的画图程序里保存文件,在保存类型:JPEG(*.JPG,*.JPEG,*. ...
- 微信小程序canvas实现圆形计时器功能
index.js import Canvas from '../../utils/canvas.js'Page({ ...Canvas.options, /** * 页面的初始数据 */ data: ...