【JavaScript基础知识】——正则表达式

正则表达式已经不是第一次接触了，第一次是在一个十期师哥的博客上看到的，那时候觉得它好新鲜，感觉就是为我的学习注入了新的血液，让我很渴望接下来的学习。后面再Asp.net中也学到了一些验证控件，也是正则表达式的运用。其实正则表达式是我们经常见到的，在我们在一些网站上注册或登录的时候，如果你的用户名输入不按照系统规定的格式输入，在输入框就会显示一串提示，这就是正则表达式的作用。如我在淘宝注册，输入的电子邮箱格式不对的时候，就会自动显示一些提示信息。
正则表达式的运用：【JavaScript基础知识】——正则表达式

一、什么是正则表达式
正则表达式是一个描述字符模式的对象。ECMAScript的RegExp类表示正则表达式，而String和RegExp都定义了使用正则表达式进行强大的模式匹配和文本检索与替换的函数。说白了正则表达式就是用来验证客户端输入的数据。在我们在一些网站上注册或登录的时候，如果你的用户名输入不按照系统规定的格式输入，在输入框就会显示一串提示，这就是正则表达式的作用。

二、创建正则表达式
创建正则表达式和创建字符串类似，但是创建正则表达式的时候，不区分大小写。创建正则表达式提供了两种方法，一种是采用new运算符，另一个是采用字面量方式。
1、new运算符方法

<span style="font-family:KaiTi_GB2312;font-size:24px;">var box = new RegExp('box'); //第一个参数字符串
var box = new RegExp('box', 'ig'); //第二个参数可选模式修饰符</span>

2、才用字面量方式

<span style="font-family:KaiTi_GB2312;font-size:24px;">var box = /box/; //直接用两个反斜杠
var box = /box/ig; //在第二个斜杠后面加上模式修饰符</span>

3、测试正则表达式
RegExp有两种测试正则表达式的方法：test()和exec()。它们的功能相似，用于测试字符串匹配。

方法	功能
test	测试模式匹配，在字符串中查找是否存在指定的正则表达式并返回布尔值，如果存在返回true，不存在则返回false
exc	执行匹配搜索，如果exec()方法执行成功，则返回包含该查找字符串的相关信息数组。如果执行失败，则返回null。

1）使用new运算符的test方法示例

<span style="font-family:KaiTi_GB2312;font-size:24px;">var pattern = new RegExp('box', 'i'); 
var str = 'This is a Box!'; //创建要比对的字符串
alert(pattern.test(str)); //通过 test()方法验证是否匹配</span>

2）使用字面量方式的test方法示例

<span style="font-family:KaiTi_GB2312;font-size:24px;">var pattern = /box/i; 
var str = 'This is a Box!';
alert(pattern.test(str));</span>

3）使用一天语句实现正则匹配

<span style="font-family:KaiTi_GB2312;font-size:24px;">alert(/box/i.test('This is a Box!')); //模式和字符串替换掉了两个变量</span>

4）使用exec返回匹配数组

<span style="font-family:KaiTi_GB2312;font-size:24px;">var pattern = /box/i;
var str = 'This is a Box!';
alert(pattern.exec(str)); //匹配了返回数组，否则返回 null</span>

3、String对象提供的4个使用正则表示的方法

方法	含义
Match(pattern)	返回pattern中的子串或null
Repace(patten,replacement)	用replacement替换pattern
Searh(pattern)	返回字符串中pattern开始位置
Split(pattern)	返回字符串按指定pattern拆分的数组

三、获取控制

正则表达式元字符是包含特殊含义的字符。它们有一些特殊功能，可以控制匹配模式方式。反斜杠后元字符将失去其特殊含义。

示例：使用点元字符

<span style="font-family:KaiTi_GB2312;font-size:24px;">var pattern = /g..gle/; //.匹配一个任意字符
var str = 'google';
alert(pattern.test(str));</span>

正则表达式的获取控制有很多细小的知识点，还得在多用的基础上才能够掌握。

四、常用的正则表达式

1、检查邮政编码

<span style="font-family:KaiTi_GB2312;font-size:24px;">var pattern = /[1-9][0-9]{5}/; //共 6 位数字，第一位不能为 0
var str = '224000';
alert(pattern.test(str));</span>

2、检查文件压缩包

<span style="font-family:KaiTi_GB2312;font-size:24px;">var pattern = /[\w]+\.zip|rar|gz/; //\w 表示所有数字和字母加下划线
var str = '123.zip'; //\.表示匹配.，后面是一个选择
alert(pattern.test(str));</span>

3、删除多余空格

<span style="font-family:KaiTi_GB2312;font-size:24px;">var pattern = /\s/g; //g 必须全局，才能全部匹配
var str = '111 222 333';
var result = str.replace(pattern,''); //把空格匹配成无空格
alert(result);</span>

4、删除首尾空格

<span style="font-family:KaiTi_GB2312;font-size:24px;">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') + '|'); //使用了分组获取</span>

5、简单的电子邮件验证

<span style="font-family:KaiTi_GB2312;font-size:24px;">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));</span>

五、总结

因为有了正则表达式的运用，使得一些验证信息在客户端进行验证，也就节约了大量的服务器端的系统资源，并且能够提供更好的用户体验。但是现在正则表达式在实战中运用得很少，所以对于它的熟练使用程度是很低的，还得在实战中才能够掌握好它。

秒客网

【JavaScript基础知识】——正则表达式

相关文章