javaScript笔记 (七) 正则表达式
来源:互联网 发布:psd头像源码怎么使用 编辑:程序博客网 时间:2024/06/08 14:23
正则表达式
假设用户需要在HTML表单中填写姓名、地址、出生日期等。那么在将表单提交到服务器进一步处理前,JavaScript程序会检查表单以确认用户确实输入了信息并且这些信息是符合要求的。
一.什么是正则表达式
正则表达式(regular expression)是一个描述字符模式的对象。ECMAScript的RegExp类表示正则表达式,而String和RegExp都定义了使用正则表达式进行强大的模式匹配和文本检索与替换的函数。
正则表达式主要用来验证客户端的输入数据。用户填写完表单单击按钮之后,表单就会被发送到服务器,在服务器端通常会用PHP、ASP.NET等服务器脚本对其进行进一步处理。因为客户端验证,可以节约大量的服务器端的系统资源,并且提供更好的用户体验。
二.创建正则表达式
创建正则表达式和创建字符串类似,创建正则表达式提供了两种方法,一种是采用new运算符,另一个是采用字面量方式。
1.两种创建方式
var box = new RegExp('box'); //第一个参数字符串
var box = new RegExp('box', 'ig'); //第二个参数可选模式修饰符
var box = /box/; //直接用两个反斜杠
var box = /box/ig; //在第二个斜杠后面加上模式修饰符
2.测试正则表达式
RegExp对象包含两个方法:test()和exec(),功能基本相似,用于测试字符串匹配。test()方法在字符串中查找是否存在指定的正则表达式并返回布尔值,如果存在则返回true,不存在则返回false。exec()方法也用于在字符串中查找指定正则表达式,如果exec()方法执行成功,则返回包含该查找字符串的相关信息数组。如果执行失败,则返回null。
/*使用new运算符的test方法示例*/
var pattern = new RegExp('box', 'i'); //创建正则模式,不区分大小写
var str = 'This is a Box!'; //创建要比对的字符串
alert(pattern.test(str)); //通过test()方法验证是否匹配
/*使用字面量方式的test方法示例*/
var pattern = /box/i; //创建正则模式,不区分大小写
var str = 'This is a Box!';
alert(pattern.test(str));
/*使用一条语句实现正则匹配*/
alert(/box/i.test('This is a Box!')); //模式和字符串替换掉了两个变量
/*使用exec返回匹配数组*/
var pattern = /box/i;
var str = 'This is a Box!';
alert(pattern.exec(str)); //匹配了返回数组,否则返回null
PS:exec方法还有其他具体应用,我们在获取控制学完后再看。
3.使用字符串的正则表达式方法
除了test()和exec()方法,String对象也提供了4个使用正则表达式的方法。
/*使用match方法获取获取匹配数组*/
var pattern = /box/ig; //全局搜索
var str = 'This is a Box!,That is a Box too';
alert(str.match(pattern)); //匹配到两个Box,Box
alert(str.match(pattern).length); //获取数组的长度
/*使用search来查找匹配数据*/
var pattern = /box/ig;
var str = 'This is a Box!,That is a Box too';
alert(str.search(pattern)); //查找到返回位置,否则返回-1
PS:因为search方法查找到即返回,也就是说无需g全局
/*使用replace替换匹配到的数据*/
var pattern = /box/ig;
var str = 'This is a Box!,That is a Box too';
alert(str.replace(pattern, 'Tom')); //将Box替换成了Tom
/*使用split拆分成字符串数组*/
var pattern = / /ig;
var str = 'This is a Box!,That is a Box too';
alert(str.split(pattern)); //将空格拆开分组成数组
RegExp对象的静态属性
/*使用静态属性*/
var pattern = /(g)oogle/;
var str = 'This is google!';
pattern.test(str);//执行一下
alert(RegExp.input); //This is google!
alert(RegExp.leftContext); //This is
alert(RegExp.rightContext); //!
alert(RegExp.lastMatch); //google
alert(RegExp.lastParen); //g
alert(RegExp.multiline); //false
PS:Opera不支持input、lastMatch、lastParen和multiline属性。IE不支持multiline属性。
所有的属性可以使用短名来操作
RegExp.input可以改写成RegExp['$_'],依次类推。但RegExp.input比较特殊,它还可以写成RegExp.$_。
RegExp对象的实例属性
/*使用实例属性*/
var pattern = /google/ig;
alert(pattern.global); //true,是否全局了
alert(pattern.ignoreCase); //true,是否忽略大小写
alert(pattern.multiline); //false,是否支持换行
alert(pattern.lastIndex); //0,下次的匹配位置
alert(pattern.source); //google,正则表达式的源字符串
var pattern = /google/g;
var str = 'google google google';
pattern.test(str);//google,匹配第一次
alert(pattern.lastIndex); //6,第二次匹配的位
PS:以上基本没什么用。并且lastIndex在获取下次匹配位置上IE和其他浏览器有偏差,主要表现在非全局匹配上。lastIndex还支持手动设置,直接赋值操作。
三.获取控制
正则表达式元字符是包含特殊含义的字符。它们有一些特殊功能,可以控制匹配模式的方式。反斜杠后的元字符将失去其特殊含义。
字符类:锚字符
/*使用点元字符*/
var pattern = /g..gle/;//.匹配一个任意字符
var str = 'google';
alert(pattern.test(str));
/*重复匹配*/
var pattern = /g.*gle/;//.匹配0个一个或多个
var str = 'google';//*,?,+,{n,m}
alert(pattern.test(str));
/*使用字符类匹配*/
var pattern = /g[a-zA-Z_]*gle/;//[a-z]*表示任意个a-z中的字符
var str = 'google';
alert(pattern.test(str));
var pattern = /g[^0-9]*gle/;//[^0-9]*表示任意个非0-9的字符
var str = 'google';
alert(pattern.test(str));
var pattern = /[a-z][A-Z]+/;//[A-Z]+表示A-Z一次或多次
var str = 'gOOGLE';
alert(pattern.test(str));
/*使用元符号匹配*/
var pattern = /g\w*gle/;//\w*匹配任意多个所有字母数字_
var str = 'google';
alert(pattern.test(str));
var pattern = /google\d*/;//\d*匹配任意多个数字
var str = 'google444';
alert(pattern.test(str));
var pattern = /\D{7,}/;//\D{7,}匹配至少7个非数字
var str = 'google8';
alert(pattern.test(str));
/*使用锚元字符匹配*/
var pattern = /^google$/;//^从开头匹配,$从结尾开始匹配
var str = 'google';
alert(pattern.test(str));
var pattern = /goo\sgle/;//\s可以匹配到空格
var str = 'goo gle';
alert(pattern.test(str));
var pattern = /google\b/;//\b可以匹配是否到了边界
var str = 'google';
alert(pattern.test(str));
/*使用或模式匹配*/
var pattern = /google|baidu|bing/;//匹配三种其中一种字符串
var str = 'google';
alert(pattern.test(str));
/*使用分组模式匹配*/
var pattern = /(google){4,8}/;//匹配分组里的字符串4-8次
var str = 'googlegoogle';
alert(pattern.test(str));
var pattern = /8(.*)8/;//获取8..8之间的任意字符
var str = 'This is 8google8';
str.match(pattern);
alert(RegExp.$1);//得到第一个分组里的字符串内容
var pattern = /8(.*)8/;
var str = 'This is 8google8';
var result = str.replace(pattern,'<strong>$1</strong>');//得到替换的字符串输出
document.write(result);
var pattern = /(.*)\s(.*)/;
var str = 'google baidu';
var result = str.replace(pattern, '$2 $1');//将两个分组的值替换输出
document.write(result);
/*关于贪婪和惰性*/
var pattern = /[a-z]+?/;//?号关闭了贪婪匹配,只替换了第一个
var str = 'abcdefjhijklmnopqrstuvwxyz';
var result = str.replace(pattern, 'xxx');
alert(result);
var pattern = /8(.+?)8/g;//禁止了贪婪,开启的全局
var str = 'This is 8google8, That is 8google8, There is 8google8';
var result = str.replace(pattern,'<strong>$1</strong>');
document.write(result);
var pattern = /8([^8]*)8/g;//另一种禁止贪婪
var str = 'This is 8google8, That is 8google8, There is 8google8';
var result = str.replace(pattern,'<strong>$1</strong>');
document.write(result);
/*使用exec返回数组*/
var pattern = /^[a-z]+\s[0-9]{4}$/i;
var str = 'google 2012';
alert(pattern.exec(str)); //返回整个字符串
var pattern = /^[a-z]+/i; //只匹配字母
var str = 'google 2012';
alert(pattern.exec(str)); //返回google
var pattern = /^([a-z]+)\s([0-9]{4})$/i; //使用分组
var str = 'google 2012';
alert(pattern.exec(str)[0]); //google 2012
alert(pattern.exec(str)[1]); //google
alert(pattern.exec(str)[2]); //2012
/*捕获性分组和非捕获性分组*/
var pattern = /(\d+)([a-z])/; //捕获性分组
var str = '123abc';
alert(pattern.exec(str));
var pattern = /(\d+)(?:[a-z])/; //非捕获性分组
var str = '123abc';
alert(pattern.exec(str));
/*使用分组嵌套*/
var pattern = /(A?(B?(C?)))/;//从外往内获取
var str = 'ABC';
alert(pattern.exec(str));
/*使用前瞻捕获*/
var pattern = /(goo(?=gle))/;//goo后面必须跟着gle才能捕获
var str = 'google';
alert(pattern.exec(str));
/*使用特殊字符匹配*/
var pattern = /\.\[\/b\]/; //特殊字符,用\符号转义即可
var str = '.[/b]';
alert(pattern.test(str));
/*使用换行模式*/
var pattern = /^\d+/mg; //启用了换行模式
var str = '1.baidu\n2.google\n3.bing';
var result = str.replace(pattern, '#');
alert(result);
四.常用的正则
1.检查邮政编码
var pattern = /[1-9][0-9]{5}/; //共6位数字,第一位不能为0
var str = '224000';
alert(pattern.test(str));
2.检查文件压缩包
var pattern = /[\w]+\.zip|rar|gz/;//\w表示所有数字和字母加下划线
var str = '123.zip';//\.表示匹配.,后面是一个选择
alert(pattern.test(str));
3.删除多余空格
var pattern = /\s/g;//g必须全局,才能全部匹配
var str = '111 222 333';
var result = str.replace(pattern,'');//把空格匹配成无空格
alert(result);
4.删除首尾空格
var pattern = /^\s+/;//强制首
var str = ' goo gle ';
var result = str.replace(pattern, '');
pattern = /\s+$/;//强制尾
result = result.replace(pattern, '');
alert('|' + result + '|');
var pattern = /^\s*(.+?)\s*$/;//使用了非贪婪捕获
var str = ' google ';
alert('|' +pattern.exec(str)[1] + '|');
var pattern = /^\s*(.+?)\s*$/;
var str = ' google ';
alert('|' + str.replace(pattern, '$1') + '|');//使用了分组获取
5.简单的电子邮件验证
var pattern = /^([a-zA-Z0-9_\.\-]+)@([a-zA-Z0-9_\.\-]+)\.([a-zA-Z]{2,4})$/;
var str = 'yc60.com@gmail.com';
alert(pattern.test(str));
var pattern = /^([\w\.\-]+)@([\w\.\-]+)\.([\w]{2,4})$/;
var str = 'yc60.com@gmail.com';
alert(pattern.test(str));
PS:以上是简单电子邮件验证,复杂的要比这个复杂很多,大家可以搜一下。
- javaScript笔记 (七) 正则表达式
- JavaScript学习笔记(七) JSON和正则表达式字面量
- javascript正则表达式笔记
- Javascript 正则表达式笔记
- javascript正则表达式笔记
- DOM笔记(十):JavaScript正则表达式
- javascript笔记--(第十章)正则表达式
- javascript正则表达式(七)(小案例)
- 个人PHP学习笔记(七)--正则表达式
- JS:正则表达式学习笔记(七) - 分组
- 正则表达式入门经典(学习笔记七)——正则表达式的灵敏度和特殊性
- javascript正则表达式学习笔记
- javascript正则表达式学习笔记
- JavaScript 正则表达式学习笔记
- javascript 正则表达式笔记录
- Javascript学习笔记-----正则表达式
- javaScript学习笔记正则表达式
- javascript正则表达式详细笔记
- window 根据盘符获取磁盘号
- Python学习笔记五:数字和字符串
- 概率论中的建模思想
- js(javaScript)学习系列--基础
- 理解 Neutron Server 分层模型 - 每天5分钟玩转 OpenStack(69)
- javaScript笔记 (七) 正则表达式
- HDU 5793 A Boring Question (数学)
- 经典算法-给出2n+1个数,其中有2n个数出现过两次,用简便的最方法求出现一次的数
- 利用特征根方程实现通项公式与递推关系的互换
- linux中ps配合Kill进程的N种方法
- String字符串的操作
- Python学习笔记六:列表、元组、字典
- 一些资源汇总,持续更新
- 第7课 Go结构struct