javascript代码实例教程-javascript之正则表达式(上)

发布时间:2019-01-14 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-javascript之正则表达式(上)脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
小宝典致力于为广大程序猿(媛)提供高品质的代码服务,请大家多多光顾小站,小宝典在此谢过。

javascript之正则表达式

一. 什么是正则表达式

正则表达式(regular exPression)是一个描述字符模式的对象。ECMAScript 的 RegExp 类表示正则表达式,而 String 和 RegExp 都定义了使用正则表达式进行强大的模式匹配和文本检索与替换的函数。正则表达式主要用来验证客户端的输入数据。 用户填写完表单单击按钮之后, 表单就会被发送到服务器,在服务器端通常会用 PHP、ASP.NET 等服务器脚本对其进行进一步处理 。因为客户端验证,可以节约大量的服务器端的系统资,并且提供更好的用户体验。

二. 创建正则表达式

创建正则表达式和创建字符串类似,创建正则表达式提供了两种方法,一种是采用 new运算符,另一个是采用字面量方式。

1.两种创建方式

//第一个参数字符串

VAR box = new RegExp('box');

//第二个参数可选模式修饰符

var box = new RegExp('box', 'ig');

选模式修饰符的可选参数有i(忽略大小写)g(全局匹配)m(多行匹配)

//直接用两个反斜杠

var box = /box/;

//在第二个斜杠后面加上模式修饰符

var box = /box/ig;

2.测试正则表达式

RegExp 对象包含两个方法:test()和 exec(),功能基本相似,用于测试字符串匹配。test()方法在字符串中查找是否存在指定的正则表达式并返回布尔值,如果存在则返回 true,不存在则返回 false。exec()方法也用于在字符串中查找指定正则表达式,如果 exec()方法执行成功,则返回包含该查找字符串的相关信息数组。如果执行失败,则返回 null。

//创建正则模式,不区分大小写

var pattern = new RegExp('box','i');

//创建要比对的字符串

var str = 'This is a Box!';

//通过test()方法验证是否匹配

alert(pattern.test(str));

//创建正则模式,不区分大小写

var pattern = /box/i;

var str = 'This is a Box!';

alert(pattern.test(str));

//模式和字符串替换掉了两个变量

alert(/box/i.test('This is a Box!'));

var pattern = /box/i;

var str = 'This is a Box!';

//匹配了返回数组,否则返回 null

alert(pattern.exec(str));

3.使用字符串的正则表达式方法

除了 test()和 exec()方法,String 对象也提供了 4 个使用正则表达式的方法。

String 对象中的正则表达式方法

match(pattern) 返回 pattern 中的子串或 null

replace(pattern, replacement) 用 replacement 替换 pattern

seArch(pattern) 返回字符串中 pattern 开始位置

splIT(pattern)返回字符串按指定 pattern 拆分的数组

/*使用Match方法获取获取匹配数组*/

var pattern = /box/ig; //全局搜索

var str = 'This is a Box! That is a Box too';

//匹配到两个 Box,Box

alert(str.match(pattern));

//获取数组的长度

alert(str.match(pattern).length);

/*使用 search 来查找匹配数据*/

var pattern = /box/ig;

var str = 'This is a Box! That is a Box too';

//查找到返回位置,否则返回-1

alert(str.search(pattern));

//注:因为search方法查找到即返回,也就是说无需g全局

/*使用 replace 替换匹配到的数据*/

var pattern = /box/ig;

var str = 'This is a Box! That is a Box too';

//将 Box 替换成了 Tom

alert(str.replace(pattern, 'Tom'));

/*使用 split 拆分成字符串数组*/

var pattern = / /ig;

var str = 'This is a Box! That is a Box too';

//将空格拆开分组成数组

alert(str.split(pattern));

三. 获取控制

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

javascript代码实例教程-javascript之正则表达式(上)

javascript代码实例教程-javascript之正则表达式(上)

javascript代码实例教程-javascript之正则表达式(上)

javascript代码实例教程-javascript之正则表达式(上)

javascript代码实例教程-javascript之正则表达式(上)

字符类:记录字符

元字符/元符号 匹配情况

(string) 用于反向引用的分组

/1 或$1 匹配第一个分组中的内容

/2 或$2 匹配第二个分组中的内容

/3 或$3 匹配第三个分组中的内容

/*使用点元字符*/

//.匹配一个任意字符

var pattern = /g..gle/;

var str = 'GOOGLE';

alert(pattern.test(str));

/*重复匹配*/

//.匹配 0 个一个或多个

var pattern = /g.*gle/;

var str = 'google'; //*,?,+,{n,m}

alert(pattern.test(str));

/*使用字符类匹配*/

//[a-z]*表示任意个 a-z 中的字符

var pattern = /g[a-zA-Z_]*gle/;

var str = 'google';

alert(pattern.test(str));

//[^0-9]*表示任意个非 0-9 的字符

var pattern = /g[^0-9]*gle/;

var str = 'google';

alert(pattern.test(str));

//[A-Z]+表示 A-Z 一次或多次

var pattern = /[a-z][A-Z]+/;

var str = 'gOOGLE';

alert(pattern.test(str));

/*使用元符号匹配*/

///w*匹配任意多个所有字母数字_

var pattern = /g/w*gle/;

var str = 'google';

alert(pattern.test(str));

///d*匹配任意多个数字

var pattern = /google/d*/;

var str = 'google444';

alert(pattern.test(str));

///D{7,}匹配至少 7 个非数字

var pattern = //D{7,}/;

var str = 'google8';

alert(pattern.test(str));

/*使用元字符匹配*/

//^从开头匹配,$从结尾开始匹配

var pattern = /^google$/;

var str = 'google';

alert(pattern.test(str));

///s 可以匹配到空格

var pattern = /goo/sgle/;

var str = 'goo gle';

alert(pattern.test(str));

///b 可以匹配是否到了边界

var pattern = /google/b/;

var str = 'google';

alert(pattern.test(str));

/*使用或模式匹配*/

//匹配三种其中一种字符串

var pattern = /google|baidu|bing/;

var str = 'google';

alert(pattern.test(str));

/*使用分组模式匹配*/

//匹配分组里的字符串 4-8 次

var pattern = /(google){4,8}/;

var str = 'googlegoogle';

alert(pattern.test(str));

/获取 8..8 之间的任意字符

var pattern = /8(.*)8/; /

var str = 'This is 8google8';

str.match(pattern);

//得到第一个分组里的字符串内容

var pattern = /8(.*)8/;

var str = 'This is 8google8';

//得到替换的字符串输出

var result = str.replace(pattern,'$1');

document.write(result);

var pattern = /(.*)/s(.*)/;

var str = 'google baidu';

//将两个分组的值替换输出

var result = str.replace(pattern, '$2 $1');

document.write(result);

javascript代码实例教程-javascript之正则表达式(上)

/*关于贪婪和惰性*/

//?号关闭了贪婪匹配,只替换了第一个

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,'$1');

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,'$1');

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';

//返回 google

alert(pattern.exec(str));

//使用分组

var pattern = /^([a-z]+)/s([0-9]{4})$/i;

var str = 'google 2012';

//google 2012

alert(pattern.exec(str)[0]);

//google

alert(pattern.exec(str)[1]);

//2012

alert(pattern.exec(str)[2]);

/*捕获性分组和非捕获性分组*/

//捕获性分组

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));

/*使用前瞻捕获*/

//goo 后面必须跟着 gle 才能捕获

var pattern = /(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);

觉得可用,就经常来吧! 脚本宝典 欢迎评论哦! js脚本,巧夺天工,精雕玉琢。小宝典献丑了!

脚本宝典总结

以上是脚本宝典为你收集整理的javascript代码实例教程-javascript之正则表达式(上)全部内容,希望文章能够帮你解决javascript代码实例教程-javascript之正则表达式(上)所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。